原文链接：

EasyUI——常见用法总结

1. 使用 data-options 来初始化属性。

data-options是jQuery Easyui 最近两个版本才加上的一个特殊属性。通过这个属性，我们可以对easyui组件的实例化可以完全写入到html中，例如：

<div class="easyui-dialog" style="width:400px;height:200px"

    data-options="title:'My Dialog',collapsible:true,iconCls:'icon-ok',onOpen:function(){}">

    dialog content.

</div>

属性，事件，都可以直接写在data-options里面，这样就方便多了。

来自：http://easyui.btboys.com/the-use-of-easyui-data-options.html

2.  tools定义工具栏，继承自panel的应该都可以使用。

$('#p').panel({

    width:500,

    height:150,

    title: 'My Panel',

   tools: [{

     iconCls:'icon-add',

     handler:function(){alert('new')}

    },{

     iconCls:'icon-save'

     handler:function(){alert('save')}

   }]

});

tools 同样可以加到data-options里面。

3.  easyui 里面的组件属性，同样可以写在标签里面。

<div id="p" class="easyui-panel" title="My Panel" style="width:500px;height:150px;padding:10px;background:#fafafa;"

          iconCls="icon-save"  closable="true"

          collapsible="true" minimizable="true" maximizable=true>

      <p>panel content.</p>

      <p>panel content.</p>

</div>

data-options和这里效果是一样，但是API里面大部分是按照属性来定义标签的，就想早先的HTML，而data-options就想style定义样式，不知道这两种有什么优劣。

 4. 继承

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title></title>

    <script src="easyui/jquery-1.7.2.min.js" type="text/javascript"></script>

    <script src="easyui/jquery.easyui.min.js" type="text/javascript"></script>

    <link href="easyui/themes/gray/easyui.css" rel="stylesheet" type="text/css" />

    <link href="easyui/themes/icon.css" rel="stylesheet" type="text/css" />

    <script type="text/javascript">

        $(function () {

            $('#dd').dialog({

                title: "My Dialog",

                modal: true, //dialog继承自window，而window里面有modal属性，所以dialog也可以使用

                collapsible: true, //是否可折叠，默认false

                minimizable: false, //是否可最小化，默认false

                maximizable: true, //是否可最大化，默认false

                resizable: true, //是否可折叠，默认false

                toolbar: [{

                    iconCls: 'icon-add',

                    handler: function () { alert('new') }

                }, {

                    iconCls: 'icon-save',

                    handler: function () { alert('save') }

                }],

                buttons: [{

                    iconCls: 'icon-add',

                    handler: function () { alert('new') }

                }, {

                    iconCls: 'icon-save',

                    handler: function () { alert('save') }

                }],

                //继承自panel,tool只有下面两个属性

                tools: [{

                    iconCls: 'icon-add',

                    handler: function () { alert('new') }

                }, {

                    iconCls: 'icon-save',

                    handler: function () { alert('save') }

                }]

            });

        })

    </script>

</head>

<body>

    <div id="dd" style="width: 500px; height: 400px;">

        Dialog Content.

    </div>

</body>

</html>

[转]EasyUI——常见用法总结的更多相关文章

  1. EasyUI——常见用法总结

    1. 使用 data-options 来初始化属性. data-options是jQuery Easyui 最近两个版本才加上的一个特殊属性.通过这个属性,我们可以对easyui组件的实例化可以完全写 ...

  2. Linux中find常见用法

    Linux中find常见用法示例 ·find   path   -option   [   -print ]   [ -exec   -ok   command ]   {} \; find命令的参数 ...

  3. php中的curl使用入门教程和常见用法实例

    摘要: [目录] php中的curl使用入门教程和常见用法实例 一.curl的优势 二.curl的简单使用步骤 三.错误处理 四.获取curl请求的具体信息 五.使用curl发送post请求 六.文件 ...

  4. Guava中Predicate的常见用法

    Guava中Predicate的常见用法 1.  Predicate基本用法 guava提供了许多利用Functions和Predicates来操作Collections的工具,一般在 Iterabl ...

  5. find常见用法

    Linux中find常见用法示例 ·find   path   -option   [   -print ]   [ -exec   -ok   command ]   {} \; find命令的参数 ...

  6. iOS 开发多线程篇—GCD的常见用法

    iOS开发多线程篇—GCD的常见用法 一.延迟执行 1.介绍 iOS常见的延时执行有2种方式 (1)调用NSObject的方法 [self performSelector:@selector(run) ...

  7. iOS开发多线程篇—GCD的常见用法

    iOS开发多线程篇—GCD的常见用法 一.延迟执行 1.介绍 iOS常见的延时执行有2种方式 (1)调用NSObject的方法 [self performSelector:@selector(run) ...

  8. NSString常见用法总结

    //====================NSStirng 的常见用法==================== -(void)testString { //创建格式化字符串:占位符(由一个%加一个字 ...

  9. [转]Linux中find常见用法示例

    Linux中find常见用法示例[转]·find   path   -option   [   -print ]   [ -exec   -ok   command ]   {} \;find命令的参 ...

随机推荐

  1. （转) java 简单工厂模式（实现一个计算器）

    package com.simpleFactory; /** * 运算类 * @author Administrator * */ public class Operation { private d ...

  2. 如何获取并分析L2CAP包

    本文中的分析与软件相关的内容,都是以WinCE中的 Microsoft Bluetooth Core Stack为例进行分析:与协议有关的内容,是基于Bluetooth Core 2.1 + EDR ...

  3. cwe

  4. JS中数组对象去重

    JS数组去重 JS中对数组去重最好不要用unique方法,该方法主要是对dom节点数组的去重,如果对普通的数组元素去重只会去掉与之相邻的重复元素,也就是如果数组中还有不相邻的重复元素存在,将不会被去掉 ...

  5. iOS Plist文件，增删改查

    今天早上,9点开始弄Plist,然后一直写,一直写(中午取出40分钟吃饭时间),写到1点,写完了,交给头,头说,不是这个意思.我是每个用户创建了一个文件夹,在这个用户的文件夹里面,分别根据应用创建了文 ...

  6. 【转】TableLayout(表格布局)

    转自:http://www.cnblogs.com/zhangs1986/archive/2013/01/17/2864536.html TableLayout(表格布局) 表格布局模型以行列的形式管 ...

  7. django http 403 错误

    在使用android的xUtils框架提交post请求到django服务器上面,出现错误,返回Forbiddeen.解决方法记录于此. 参考链接 http://blog.csdn.net/liangp ...

  8. OceanBase架构浅析（二）

    单点性能 OceanBase架构的优势在于既支持跨行跨表事务,又支持存储服务器线性扩展.当然,这个架构也有一个明显的缺陷:UpdateServer单点,这个问题限制了OceanBase集群的整体读写性 ...

  9. iOS单例模式

    单例模式用于当一个类只能有一个实例的时候, 通常情况下这个“单例”代表的是某一个物理设备比如打印机,或是某种不可以有多个实例同时存在的虚拟资源或是系统属性比如一个程序的某个引擎或是数据.用单例模式加以 ...

  10. cp 命令(转）

    cp命令用来复制文件或者目录,是Linux系统中最常用的命令之一.一般情况下,shell会设置一个别名,在命令行下复制文件时,如果目标文件已经存在,就会询问是否覆盖,不管你是否使用-i参数.但是如果是 ...