jQuery EasyUI使用教程之自定义窗口工具

最新推荐文章于 2023-04-16 10:58:25 发布

界面开发小八哥

最新推荐文章于 2023-04-16 10:58:25 发布

阅读量577

点赞数

jQuery EasyUI最新试用版下载请猛戳>>

默认情况下，窗口有四个工具：collapsible、minimizable、maximizable和closable。比如我们定义以下窗口：

 
   
        < 
        div 
         id 
        = 
        "win" 
         class 
        = 
        "easyui-window" 
         title 
        = 
        "My Window" 
         style 
        = 
        "padding:10px;width:200px;height:100px;" 
        > 
       
 
        window content 
       
 
        </ 
        div 
        > 
       
 
 

如需自定义工具，设置该工具为true或者false。比如我们希望定义一个窗口，仅仅拥有一个可关闭的工具。您应该设置任何其他工具为 false。我们可以在标记中或者通过jQuery代码定义tools现在我们使用jQuery代码来定义窗口：

 
        $( 
        '#win' 
        ).window({ 
       
        collapsible: 
        false 
        , 
       
        minimizable: 
        false 
        , 
       
        maximizable: 
        false 
       
        });

如果我们希望添加自定义的工具到窗口，可以使用tools属性。作为实例演示，我们添加两个工具到窗口：

 
        $( 
        '#win' 
        ).window({ 
       
        collapsible: 
        false 
        , 
       
        minimizable: 
        false 
        , 
       
        maximizable: 
        false 
        , 
       
        tools:[{ 
       
        iconCls: 
        'icon-add' 
        , 
       
        handler: 
        function 
        (){ 
       
        alert( 
        'add' 
        ); 
       
        } 
       
        },{ 
       
        iconCls: 
        'icon-remove' 
        , 
       
        handler: 
        function 
        (){ 
       
        alert( 
        'remove' 
        ); 
       
        } 
       
        }] 
       
        });