?? table.htm
字號(hào):
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<link rel="stylesheet" href="../Include/ManageStyle.css" type="text/css">
<script language="JavaScript" src="dialog.js"></script>
<script language="JavaScript">
var sAction = "INSERT";
var sTitle = "插入";
var oControl;
var oSeletion;
var sRangeType;
var sRow = "2";
var sCol = "2";
var sAlign = "";
var sBorder = "1";
var sCellPadding = "3";
var sCellSpacing = "2";
var sWidth = "";
var sBorderColor = "#000000";
var sBgColor = "#FFFFFF";
var sWidthUnit = "%"
var bCheck = true;
var bWidthDisable = false;
var sWidthValue = "100"
oSelection = dialogArguments.Editor.document.selection.createRange();
sRangeType = dialogArguments.Editor.document.selection.type;
if (sRangeType == "Control") {
if (oSelection.item(0).tagName == "TABLE"){
sAction = "MODI";
sTitle = "修改";
oControl = oSelection.item(0);
sRow = oControl.rows.length;
sCol = getColCount(oControl);
sAlign = oControl.align;
sBorder = oControl.border;
sCellPadding = oControl.cellPadding;
sCellSpacing = oControl.cellSpacing;
sWidth = oControl.width;
sBorderColor = oControl.borderColor;
sBgColor = oControl.bgColor;
}
}
document.write("<title>表格屬性(" + sTitle + ")</title>");
// 初始值
function InitDocument(){
SearchSelectValue(d_align, sAlign.toLowerCase());
// 修改狀態(tài)時(shí)取值
if (sAction == "MODI"){
if (sWidth == ""){
bCheck = false;
bWidthDisable = true;
sWidthValue = "100";
sWidthUnit = "%";
}else{
bCheck = true;
bWidthDisable = false;
if (sWidth.substr(sWidth.length-1) == "%"){
sWidthValue = sWidth.substring(0, sWidth.length-1);
sWidthUnit = "%";
}else{
sWidthUnit = "";
sWidthValue = parseInt(sWidth);
if (isNaN(sWidthValue)) sWidthValue = "";
}
}
}
switch(sWidthUnit){
case "%":
d_widthunit.selectedIndex = 1;
break;
default:
sWidthUnit = "";
d_widthunit.selectedIndex = 0;
break;
}
d_row.value = sRow;
d_col.value = sCol;
d_border.value = sBorder;
d_cellspacing.value = sCellSpacing;
d_cellpadding.value = sCellPadding;
d_widthvalue.value = sWidthValue;
d_widthvalue.disabled = bWidthDisable;
d_widthunit.disabled = bWidthDisable;
d_bordercolor.value = sBorderColor;
s_bordercolor.style.backgroundColor = sBorderColor;
d_bgcolor.value = sBgColor;
s_bgcolor.style.backgroundColor = sBgColor;
d_check.checked = bCheck;
}
// 判斷值是否大于0
function MoreThanOne(obj, sErr){
var b=false;
if (obj.value!=""){
obj.value=parseFloat(obj.value);
if (obj.value!="0"){
b=true;
}
}
if (b==false){
BaseAlert(obj,sErr);
return false;
}
return true;
}
// 得到表格列數(shù)
function getColCount(oTable) {
var intCount = 0;
if (oTable != null) {
for(var i = 0; i < oTable.rows.length; i++){
if (oTable.rows[i].cells.length > intCount) intCount = oTable.rows[i].cells.length;
}
}
return intCount;
}
// 增加行
function InsertRows( oTable ) {
if ( oTable ) {
var elRow=oTable.insertRow();
for(var i=0; i<oTable.rows[0].cells.length; i++){
var elCell = elRow.insertCell();
elCell.innerHTML = " ";
}
}
}
// 增加列
function InsertCols( oTable ) {
if ( oTable ) {
for(var i=0; i<oTable.rows.length; i++){
var elCell = oTable.rows[i].insertCell();
elCell.innerHTML = " "
}
}
}
// 刪除行
function DeleteRows( oTable ) {
if ( oTable ) {
oTable.deleteRow();
}
}
// 刪除列
function DeleteCols( oTable ) {
if ( oTable ) {
for(var i=0;i<oTable.rows.length;i++){
oTable.rows[i].deleteCell();
}
}
}
</script>
<script event="onclick" for="Ok" language="JavaScript">
// 邊框顏色的有效性
sBorderColor = d_bordercolor.value;
if (!IsColor(sBorderColor)){
BaseAlert(d_bordercolor,'無效的邊框顏色值!');
return;
}
// 背景顏色的有效性
sBgColor = d_bgcolor.value;
if (!IsColor(sBgColor)){
BaseAlert(d_bgcolor,'無效的背景顏色值!');
return;
}
// 行數(shù)的有效性
if (!MoreThanOne(d_row,'無效的行數(shù),至少要1行!')) return;
// 列數(shù)的有效性
if (!MoreThanOne(d_col,'無效的列數(shù),至少要1列!')) return;
// 邊線粗細(xì)的有效性
if (d_border.value == "") d_border.value = "0";
if (d_cellpadding.value == "") d_cellpadding.value = "0";
if (d_cellspacing.value == "") d_cellspacing.value = "0";
// 去前導(dǎo)0
d_border.value = parseFloat(d_border.value);
d_cellpadding.value = parseFloat(d_cellpadding.value);
d_cellspacing.value = parseFloat(d_cellspacing.value);
// 寬度有效值性
var sWidth = "";
if (d_check.checked){
if (!MoreThanOne(d_widthvalue,'無效的表格寬度!')) return;
sWidth = d_widthvalue.value + d_widthunit.value;
}
sRow = d_row.value;
sCol = d_col.value;
sAlign = d_align.options[d_align.selectedIndex].value;
sBorder = d_border.value;
sCellPadding = d_cellpadding.value;
sCellSpacing = d_cellspacing.value;
if (sAction == "MODI") {
// 修改行數(shù)
var xCount = sRow - oControl.rows.length;
if (xCount > 0)
for (var i = 0; i < xCount; i++) InsertRows(oControl);
else
for (var i = 0; i > xCount; i--) DeleteRows(oControl);
// 修改列數(shù)
var xCount = sCol - getColCount(oControl);
if (xCount > 0)
for (var i = 0; i < xCount; i++) InsertCols(oControl);
else
for (var i = 0; i > xCount; i--) DeleteCols(oControl);
try {
oControl.width = sWidth;
}
catch(e) {
//alert("對(duì)不起,請(qǐng)您輸入有效的寬度值!\n(如:90% 200 300px 10cm)");
}
oControl.align = sAlign;
oControl.border = sBorder;
oControl.cellSpacing = sCellSpacing;
oControl.cellPadding = sCellPadding;
oControl.borderColor = sBorderColor;
oControl.bgColor = sBgColor;
}else{
var sTable = "<table align='"+sAlign+"' border='"+sBorder+"' cellpadding='"+sCellPadding+"' cellspacing='"+sCellSpacing+"' width='"+sWidth+"' bordercolor='"+sBorderColor+"' bgcolor='"+sBgColor+"'>";
for (var i=1;i<=sRow;i++){
sTable = sTable + "<tr>";
for (var j=1;j<=sCol;j++){
sTable = sTable + "<td> </td>";
}
}
sTable = sTable + "</table>";
dialogArguments.insertHTML(sTable);
}
window.returnValue = null;
window.close();
</script>
</head>
<body bgcolor="menu" onload="InitDocument()">
<table border="0" cellpadding="0" cellspacing="0" align="center">
<tr>
<td><fieldset>
<legend>表格大小</legend>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="9" height="5"></td>
</tr>
<tr>
<td width="7"></td>
<td>表格行數(shù):</td>
<td width="5"></td>
<td>
<input type="text" id="d_row" size="10" value onkeypress="event.returnValue=IsDigit();" maxlength="3"></td>
<td width="30"></td>
<td>表格列數(shù):</td>
<td width="5"></td>
<td>
<input type="text" id="d_col" size="10" value onkeypress="event.returnValue=IsDigit();" maxlength="3"></td>
<td width="7"></td>
</tr>
<tr>
<td colspan="9" height="5"></td>
</tr>
</table>
</fieldset> </td>
</tr>
<tr>
<td height="5"></td>
</tr>
<tr>
<td><fieldset>
<legend>表格布局</legend>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="9" height="5"></td>
</tr>
<tr>
<td width="7"></td>
<td>對(duì)齊方式:</td>
<td width="5"></td>
<td><select id="d_align" style="width:78px">
<option value>默認(rèn)</option>
<option value="left">左對(duì)齊</option>
<option value="center">居中</option>
<option value="right">右對(duì)齊</option>
</select> </td>
<td width="30"></td>
<td>邊框粗細(xì):</td>
<td width="5"></td>
<td>
<input type="text" id="d_border" size="10" value onkeypress="event.returnValue=IsDigit();"></td>
<td width="7"></td>
</tr>
<tr>
<td colspan="9" height="5"></td>
</tr>
<tr>
<td width="7"></td>
<td>單元間距:</td>
<td width="5"></td>
<td>
<input type="text" id="d_cellspacing" size="10" value onkeypress="event.returnValue=IsDigit();" maxlength="3"></td>
<td width="30"></td>
<td>單元邊距:</td>
<td width="5"></td>
<td>
<input type="text" id="d_cellpadding" size="10" value onkeypress="event.returnValue=IsDigit();" maxlength="3"></td>
<td width="7"></td>
</tr>
<tr>
<td colspan="9" height="5"></td>
</tr>
</table>
</fieldset> </td>
</tr>
<tr>
<td height="5"></td>
</tr>
<tr>
<td><fieldset>
<legend>表格寬度</legend>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td colspan="9" height="5"></td>
</tr>
<tr>
<td width="7"></td>
<td onclick="d_check.click()" nowrap valign="middle">
<input id="d_check" type="checkbox" onclick="d_widthvalue.disabled=(!this.checked);d_widthunit.disabled=(!this.checked);" value="1">
指定表格的寬度</td>
<td align="right" width="60%">
<input name="d_widthvalue" type="text" value size="5" onkeypress="event.returnValue=IsDigit();" maxlength="4">
<select name="d_widthunit">
<option value="px">像素</option>
<option value="%">百分比</option>
</select> </td>
<td width="7"></td>
</tr>
<tr>
<td colspan="9" height="5"></td>
</tr>
</table>
</fieldset> </td>
</tr>
<tr>
<td height="5"></td>
</tr>
<tr>
<td><fieldset>
<legend>表格顏色</legend>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="9" height="5"></td>
</tr>
<tr>
<td width="7"></td>
<td>邊框顏色:</td>
<td width="5"></td>
<td><input type="text" id="d_bordercolor" size="7" value></td>
<td>
<img border="0" src="../Images/Rect.gif" style="cursor:hand" id="s_bordercolor" onclick="SelectColor('bordercolor')"></td>
<td width="30"></td>
<td>背景顏色:</td>
<td width="5"></td>
<td><input type="text" id="d_bgcolor" size="7" value></td>
<td>
<img border="0" src="../Images/Rect.gif" style="cursor:hand" id="s_bgcolor" onclick="SelectColor('bgcolor')"></td>
<td width="7"></td>
</tr>
<tr>
<td colspan="9" height="5"></td>
</tr>
</table>
</fieldset> </td>
</tr>
<tr>
<td height="5"></td>
</tr>
<tr>
<td align="right">
<input class="button01-out" type="submit" value="確 定" id="Ok">
<input type="button" class="button01-out" value="取 消" onclick="window.close();"></td>
</tr>
</table>
</body>
</html>
?? 快捷鍵說明
復(fù)制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號(hào)
Ctrl + =
減小字號(hào)
Ctrl + -