easyui自定義工具欄


easyui自定義工具欄

easyui的彈出框上有工具欄(上方)和按鈕欄(下方),
工具欄的按鈕默認靠左,自己沒找到調整位置的屬性。
為了在右上角放一個關閉按鈕,只能使用easyui的屬性自定義一個工具欄,主要的實現為:

  1. 創建一個div作為工具欄,在div中放要顯示的按鈕,按鈕在div中向右靠齊

  2. 在彈窗框div中添加屬性

     data-options="toolbar:'#tb'"
    

代碼如下:

 <div id="editDialog"  style="overflow: auto; overflow-x: auto;"  data-options="toolbar:'#tb'">
        <div id="box"  >
           <pre id="showMessage" style="font-size: 15px">
           </pre>
        </div>
 </div>

<div id="tb" class="dialog-button2" style="background:#f2f4f6; height: 30px">
    <a href="javascript:closeDialog()" class="l-btn" id="" style="float: right; margin-right: 2px ; vertical-align: middle"><span class="l-btn-left"><span class="l-btn-text">關閉</span></span></a>
</div>

js代碼如下:

function editRemind(editId) {
        $('#editDialog').dialog({
            width: 1000,
            height: 700,
            title: '異常詳細信息',
            modal: true,
           /* toolbar:[{
                text:'關閉'
            }],*/
          /* buttons: [{
                text: '關閉',
                handler: function () {
                    $('#editDialog').dialog('close');
                }
            }],*/
            onBeforeOpen:function(){
            },
            onOpen:function(){
                $('#showMessage').text('hello world');
            },
            cache: false
        });

    }

為了工具欄好看點,樣式都去easyui封裝好的toolbar和buttons欄中扣去吧


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM