首页 > 代码库 > easyui解析器parser

easyui解析器parser

在写代码的时候发现如果不是一次在页面写好html代码,而是通过页面加载完成后执行某个方法时添加相应的组件时,添加上去后easyui是不会给你初始化这个组件的,这个时候就必须手动的去初始化这个组件,

如我下面写的聊天窗口,点击聊天的时候初始化窗口,这个时候就需要用到

$.parser.parse(‘#cc‘);  // 解析指定节点

才能初始化窗口,否则追加上去是没有效果的,但是发现用是时候这个id又不能为当前组件的id,必须为当前组件的父容器的id

如:<div id="customerChatWindow" class="easyui-window"></div>

这是easyui的window组件,这个 id不能在parser中用,否则没效果,必须给其添加一个父容器使用父容器的id

<div id="showChatwindow">

    <div id="customerChatWindow" class="easyui-window"></div>

</div>

$.parser.parse(‘#showChatwindow‘);

这么使用才会正常


function initChatsWindow(oid){

    
    var chat = ‘<div id="showChatwindow">‘;
    chat += ‘<div id="customerChatWindow" class="easyui-window" data-options="title:\‘聊天\‘,width:400,height:600,‘;
    chat += ‘collapsible:false,minimizable:false,maximizable:false,onResize:function(width, height){$(\‘#messageDataview\‘).height(height-38-145);}">‘;
    chat += ‘<input id="customerId" type="hidden" />‘;
    chat += ‘<div id="chartWindow" class="easyui-layout" style="width:100%;height:100%;" data-options="fit:true">  ‘;
    chat += ‘    <div data-options="region:\‘center\‘,noheader:true">‘;
    chat += ‘        <div style="border-width: 0px; overflow: auto; margin: 0px; width: 100%; height: 415px; left: 0px; top: 0px; background-color: white;"‘;
    chat += ‘            id="messageDataview" >‘;
    chat += ‘        </div>‘;
    chat += ‘        <div id="panel-1219" style="margin: 0px; width: 100%; left: 0px; bottom: 0px; position: absolute;background-color: #d3e1f1;overflow: hidden;">‘;
    chat += ‘            <div id="toolbar-1221" style="width: 100%; left: 0px; top: 0px;height: 22px;">‘;
    chat += ‘                <table style="width:100%">‘;
    chat += ‘                    <tr>‘;
    chat += ‘                        <td width="50%">‘;
    chat += ‘                                <div id="container-1222" style="margin: 0px; left: 0px; top: 0px;">‘;
    chat += ‘                                <img id="filefield-1223-buttonEl-btnIconEl" onclick="sendImageToUserOfChat($(\‘#customerId\‘).val());" src=http://www.mamicode.com/"/oss-portlet/images/icons/btn_send_pic.png" />‘;
    chat += ‘                            </div>‘;
    chat += ‘                        </td>‘;
    chat += ‘                        <td width="50%" align="right">‘;
    chat += ‘                            <div style="border-width: 1px;">‘;
    chat += ‘                                <a href="javascript:void(0)" onclick="openOrCloseChatsMessageHistoryInfo($(\‘#customerId\‘).val());" style="width:80px">‘;
    chat += ‘                                    <img src=http://www.mamicode.com/"/oss-portlet/images/icons/btn_history.png" />‘;
    chat += ‘                                    <span id="button-1225-btnInnerEl" class="x-btn-inner">历史消息</span>‘;
    chat += ‘                                </a>‘;
    chat += ‘                            </div>‘;
    chat += ‘                        </td>‘;
    chat += ‘                    </tr>‘;
    chat += ‘                </table>‘;
    chat += ‘            </div>‘;
    chat += ‘            <div id="panel-1219-body" style="width: 100%; left: 0px; top: 26px; height: 95px;overflow: hidden;">‘;
    chat += ‘                <table style="border-width: 0px; table-layout: fixed; margin: 0px; width: 100%;" id="textareafield-1220">‘;
    chat += ‘                    <tbody>‘;
    chat += ‘                        <tr id="textareafield-1220-inputRow">‘;
    chat += ‘                            <td id="textareafield-1220-bodyEl" colspan="3" style="width: 100%;">‘;
    chat += ‘                                <textarea id="chatcontent" name="textareafield-1220-inputEl" rows="4" cols="20"‘;
    chat += ‘                                    style="width: 96%;overflow: auto;"></textarea>‘;
    chat += ‘                            </td>‘;
    chat += ‘                        </tr>‘;
    chat += ‘                    </tbody>‘;
    chat += ‘                </table>‘;
    chat += ‘            </div>‘;
    chat += ‘            <div style="width: 100%; left: 0px; top: 90px;background-color: #d3e1f1;">‘;
    chat += ‘                <p align="right" style="margin:0;">‘;
    chat += ‘                    <a class="easyui-linkbutton" href="javascript:void(0)" onclick="sendChatsMessage($(\‘#customerId\‘).val(), $(\‘#chatcontent\‘).val());" style="width:80px">发送(Enter)</a>‘;
    chat += ‘                </p>‘;
    chat += ‘            </div>‘;
    chat += ‘        </div>‘;
    chat += ‘    </div>‘;
    chat += ‘</div>‘;
    chat += ‘</div>‘;
    chat += ‘</div>‘;
    
    // 添加到body中
    $("body").append(chat);
    // 解析当前组件,id必须为该组件的父节点
    $.parser.parse(‘#showChatwindow‘);
}

easyui解析器parser