| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115 | <!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>    <style type="text/css">        * {margin: 0; padding: 0}        table { margin: 10px;font-size: 12px}        table tr { height: 25px}        input { width: 110px;border: 1px solid #ccc;}        select { width: 76px;margin-left:6px\9; }        span.strong {font-weight: bold;}    </style></head><body><table>    <tr>        <td width="70"><span class="strong"><var id="lang_background"></var></span></td>        <td><input id="bgColor" type="text" value="#FFFFFF"></td>    </tr>    <tr>        <td rowspan="2"><span class="strong"><var id="lang_alignment"></var></span></td>        <td><var id="lang_horizontal"></var>: <select id="align">                <option value="">默认</option>                <option value="center">居中</option>                <option value="left">居左</option>                <option value="right">居右</option>            </select>        </td>    </tr>    <tr>        <td><var id="lang_vertical"></var>: <select id="vAlign">                <option value="">默认</option>                <option value="middle">居中</option>                <option value="top">顶端对齐</option>                <option value="bottom">底端对齐</option>            </select>        </td>    </tr></table><script type="text/javascript">    addColorPickListener();    dialog.onok = function () {        var tdItem = {            bgColor:$G( "bgColor" ).value || "#FFFFFF",            align:$G( "align" ).value || "",            vAlign:$G( "vAlign" ).value || ""        };        editor.execCommand( "edittd", tdItem );    };    (function () {        if ( !editor.currentSelectedArr.length ) {            var range = editor.selection.getRange();            var td = domUtils.findParentByTagName( range.startContainer, 'td', true );            if ( td ) {                $G( "bgColor" ).value = (td.bgColor || "#FFFFFF").toUpperCase();                $G( "align" ).value = td.align || "";                $G( "vAlign" ).value = td.vAlign || "";            }        }    })();    /**     * 绑定取色器监听事件     */    function addColorPickListener() {        var colorPicker = getColorPicker(),                ids = ["bgColor"];        for ( var i = 0, ci; ci = $G( ids[i++] ); ) {            domUtils.on( ci, "click", function () {                var me = this;                showColorPicker( colorPicker, me );                colorPicker.content.onpickcolor = function ( t, color ) {                    me.value = color.toUpperCase();                    colorPicker.hide();                };                colorPicker.content.onpicknocolor = function () {                    me.value = '';                    colorPicker.hide();                };            } );            domUtils.on( ci, "keyup", function () {                colorPicker.hide();            } );        }        domUtils.on( document, 'mousedown', function () {            UE.ui.Popup.postHide( this );        } );    }    /**     * 实例化一个colorpicker对象     */    function getColorPicker() {        return new UE.ui.Popup( {            editor:editor,            content:new UE.ui.ColorPicker( {                noColorText:lang.noColor,                editor:editor            } )        } );    }    /**     * 在anchorObj上显示colorpicker     * @param anchorObj     */    function showColorPicker( colorPicker, anchorObj ) {        colorPicker.showAnchor( anchorObj );    }</script></body></html>
 |