JQueryEasyUI对话框的用法

jQuery EasyUI 对话框(Dialog)用法与EasyUI的窗口用法极为相似&＃xff0c;最终的效果图也只与窗口的效果图差几个按钮&＃xff0c;下面看一下EasyUI的对话框效果图

js代码&＃xff1a;

代码

 1 <script language&＃61;"Javascript" type&＃61;"text/Javascript">
 2          function Open_Dialog() {
 3              $(&＃39;#mydialog&＃39;).show();
 4              $(&＃39;#mydialog&＃39;).dialog({
 5              collapsible: true,
 6              minimizable: true,
 7              maximizable: true,
 8                  toolbar: [{
 9                      text: &＃39;添加&＃39;,
10                      iconCls: &＃39;icon-add&＃39;,
11                      handler: function() {
12                          alert(&＃39;添加数据&＃39;)
13                      }
14                  },{
15                      text: &＃39;保存&＃39;,
16                      iconCls: &＃39;icon-save&＃39;,
17                      handler: function() {
18                          alert(&＃39;保存数据&＃39;)
19                      }
20 }],
21                      buttons: [{
22                          text: &＃39;提交&＃39;,
23                          iconCls: &＃39;icon-ok&＃39;,
24                          handler: function() {
25                              alert(&＃39;提交数据&＃39;);
26                          }
27                      }, {
28                          text: &＃39;取消&＃39;,
29                          handler: function() {
30                              $(&＃39;#mydialog&＃39;).dialog(&＃39;取消&＃39;);
31                          }
32 }]
33                      });
34          }     
35  </script>

HTML代码

代码

1 <span onclick&＃61;"Open_Dialog()">弹框span>
2 <div id&＃61;"mydialog" style&＃61;"display:none;padding:5px;width:400px;height:200px;" title&＃61;"弹框练习">
3 <input id&＃61;"txRoleID" type&＃61;"hidden" runat&＃61;"server" value&＃61;"0" />
4             <label class&＃61;"lbInfo">角色名称&＃xff1a;label>
5             <input id&＃61;"txRolename" type&＃61;"text"  class&＃61;"easyui-validatebox" required&＃61;"true"  runat&＃61;"server" /><br />
6             <label class&＃61;"lbInfo"> label><input type&＃61;"submit" onserverclick&＃61;"saveRole"  value&＃61;"保存" runat&＃61;"server" />
7             <label id&＃61;"lbmsg" runat&＃61;"server">label>
8 div> 

 下面来介绍Window的具体用法&＃xff0c;首先来看属性大多数的属性和窗口(Window)的属性是相同的&＃xff0c;下面列出一些 Dialog私有的属性&＃xff1a;

事件
Dialog的事件和窗口(Window)的事件相同。

方法
除了”header”和”body”以外&＃xff0c;Dialog的函数方法和窗口(Window)的相同