| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232 | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"        "http://www.w3.org/TR/html4/loose.dtd"><html><head>    <title></title>    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>    <script type="text/javascript" src="../internal.js"></script>    <link rel="stylesheet" type="text/css" href="table.css"></head><body>    <div class="wrapper">        <fieldset  class="base">            <legend><var id="lang_baseInfo"></var></legend>            <table>                <tr>                    <td width="120"><label for="numRows"><var id="lang_rows"></var>: </label><input id="numRows" type="text"  /> <var id="lang_rowUnit"></var></td>                    <td>                        <label for="width"><var id="lang_width"></var>: </label><input id="width" type="text"  />                        <label for="widthUnit"><var id="lang_widthUnit"></var>: </label>                        <select id="widthUnit">                            <option value="%">%</option>                            <option value="px">px</option>                        </select>                    </td>                </tr>                <tr>                    <td><label for="numCols"><var id="lang_cols"></var>: </label><input id="numCols" type="text"  /> <var id="lang_colUnit"></var></td>                    <td>                        <label for="height"><var id="lang_height"></var>: </label><input id="height" type="text"  />                        <label for="heightUnit"><var id="lang_heightUnit"></var>: </label>                        <select id="heightUnit">                            <option value="%">%</option>                            <option value="px">px</option>                        </select>                    </td>                </tr>            </table>            <div id="message" style="display: none">                <p><var id="lang_warmPrompt"></var>:</p>                <p id="messageContent"><var id="lang_maxPadding"></var></p>            </div>        </fieldset>        <div>            <fieldset  class="extend">                <legend><var id="lang_extendInfo"></var><span style="font-weight: normal;">(<var id="lang_preview"></var>)</span></legend>                <table>                    <tr>                        <td width="60"><span class="bold"><var id="lang_tableBorder"></var></span>:</td>                        <td><label for="border"><var id="lang_borderSize"></var>: </label><input id="border" type="text"  /> px </td>                        <td><label for="borderColor"><var id="lang_borderColor"></var>: </label><input id="borderColor" type="text"  /></td>                    </tr>                    <tr style="border-bottom: 1px solid #ddd">                        <td><span class="bold"><var id="lang_mar_pad"></var></span>:</td>                        <td><label for="cellPadding"><var id="lang_margin"></var>: </label><input id="cellPadding" type="text"  /> px </td>                        <td><label for="cellSpacing"><var id="lang_padding"></var>: </label><input id="cellSpacing" type="text"  /> px </td>                    </tr>                    <tr>                        <td colspan="3"><span class="bold"><var id="lang_table_background"></var></span>:                            <input id="bgColor" type="text"  />                        </td>                    </tr>                    <tr>                        <td colspan="3"><span class="bold"><var id="lang_table_alignment"></var></span>:                            <select id="align">                                <option value=""></option>                                <option value="center"></option>                                <option value="left"></option>                                <option value="right"></option>                            </select>                        </td>                    </tr>                    <tr>                       <td colspan="3">                           <span class="bold"><var id="lang_borderFor"></var></span>:                           <select id="borderType">                               <option value="0"></option>                               <option value="1"></option>                           </select>                       </td>                    </tr>                </table>            </fieldset>            <div id="preview">                <table border="1" borderColor="#000" cellpadding="0" cellspacing="0" style="border-collapse: collapse;">                    <tr><td colspan="3"><var id="lang_forPreview"></var></td></tr>                    <tr><td></td><td></td><td></td></tr>                    <tr><td></td><td></td><td></td></tr>                </table>            </div>        </div>    </div>    <script type="text/javascript" src="table.js"></script>    <script type="text/javascript">        var inputs = document.getElementsByTagName('input'),            selects=document.getElementsByTagName('select');        //ie给出默认值        for(var i=0,ci;ci=inputs[i++];){            switch (ci.id){                case 'numRows':                case 'numCols':                    ci.value = 5;                    break;                case 'bgColor':                    ci.value = '';                    break;                case 'borderColor':                    ci.value = '#000000';                    break;                case 'border':                    ci.value = 1;                    break;                case 'cellSpacing':                case 'cellPadding':                    ci.value = '0';                    break;                default:            }        }        for(var i=0,ci;ci=selects[i++];){            ci.options[0].selected = true;        }        var state = editor.queryCommandState("edittable");        if(state == 0){            var range = editor.selection.getRange(),                    table = domUtils.findParentByTagName(range.startContainer,'table',true);            if(table){                var numRows = table.rows.length,cellCount=0;                //列取最大数                for(var i=0,ri;ri=table.rows[i++];){                    var tmpCellCount = 0;                    for(var j=0,cj;cj=ri.cells[j++];){                        if(cj.style.display != 'none'){                            tmpCellCount++;                        }                    }                    cellCount = Math.max(tmpCellCount,cellCount)                }                domUtils.setAttributes($G('numRows'),{                    'value':numRows,                    'disabled':true                });                domUtils.setAttributes($G('numCols'),{                    'value':cellCount,                    'disabled':true                });                $G("cellPadding").value = table.getAttribute("cellPadding") || '0';                $G("cellSpacing").value = table.getAttribute("cellSpacing") || '0';                var value = table.getAttribute('width');                value = !value ? ['',table.offsetWidth]:/%$/.test(value) ? value.match(/(\d+)(%)?/) : ['',value.replace(/px/i,'')];                $G("width").value = value[1];                $G('widthUnit').options[value[2] ? 0:1].selected = true;                value = table.getAttribute('height');                value = !value ? ['','']:/%$/.test(value) ? value.match(/(\d+)(%)?/) : ['',value.replace(/px/i,'')];                $G("height").value = value[1];                $G('heightUnit').options[value[2]?0:1].selected = true;                $G('borderColor').value = (table.getAttribute('borderColor')||"#000000").toUpperCase();                $G("border").value = table.getAttribute("border");                for(var i=0,ip,opts= $G("align").options;ip=opts[i++];){                    if(ip.value == (table.getAttribute('align' )||"").toLowerCase()){                        ip.selected = true;                        break;                    }                }                $G("borderType").options[table.getAttribute('borderType') == '1' ? 1: 0].selected = true;                $G("bgColor").value = (table.getAttribute("bgColor")||"").toUpperCase();                createTable();            }        }else{            $focus($G("numRows"));        }        init();        domUtils.on($G("width"),"keyup",function(){            var value = this.value;            if(value>100){                $G("widthUnit").value="px";            }        });        domUtils.on($G("height"),"keyup",function(){            var value = this.value;            if(value>100){                $G("heightUnit").value="px";            }        });        dialog.onok = function(){            for(var i=0,opt={},ci;ci=inputs[i++];){                switch (ci.id){                    case 'numRows':                    case 'numCols':                    case 'height':                    case 'width':                        if(ci.value && !/^[1-9]+[0-9]*$/.test(ci.value)){                            alert(lang.errorNum);                            $focus(ci);                            return false;                        }                        break;                    case 'cellspacing':                    case 'cellpadding':                    case 'border':                        if(ci.value && !/^[0-9]*$/.test(ci.value)){                            alert(lang.errorNum);                            $focus(ci);                            return false;                        }                        break;                    case 'bgColor':                    case 'borderColor':                        if(ci.value && !/^#(?:[0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/.test(ci.value)){                            alert(lang.errorColor);                            $focus(ci);                            return false;                        }                        break;                    default:                }                opt[ci.id] = ci.value || (ci.id == 'border' ? 0 : '')            }            for(var i=0,ci;ci=selects[i++];){                opt[ci.id] = ci.value.toUpperCase()            }            editor.execCommand(state == -1 ? 'inserttable' : 'edittable',opt );        };    </script></body></html>
 |