jquery-easyui中创建Window窗口

jquery-easyui中创建窗口很简单，建立一个DIV就行了：

Html代码



<div id="win" class="easyui-window" title="My Window" style="width:300px;height:100px;padding:5px;">

Some Content.

</div>

<div id="win" class="easyui-window" title="My Window" style="width:300px;height:100px;padding:5px;">
Some Content.
</div>

这样不用写一行JS代码窗口就会出现在屏幕上：



如果想建立一个隐藏的窗口，则需要设置属性closed="true"，需要打开时调用open方法就行：

Js代码



$('#win').window('open');

$('#win').window('open');

作为例子，我们创建一个登录窗口：

Html代码



<div id="win" class="easyui-window" title="Login" style="width:300px;height:180px;">

<form style="padding:10px 20px 10px 40px;">

<p>Name: <input type="text"></p>

<p>Pass: <input type="password"></p>

<div style="padding:5px;text-align:center;">

<a href="#" class="easyui-linkbutton" icon="icon-ok">Ok</a>

<a href="#" class="easyui-linkbutton" icon="icon-cancel">Cancel</a>

</div>

</form>

</div>

<div id="win" class="easyui-window" title="Login" style="width:300px;height:180px;">
<form style="padding:10px 20px 10px 40px;">
<p>Name: <input type="text"></p>
<p>Pass: <input type="password"></p>
<div style="padding:5px;text-align:center;">
<a href="#" class="easyui-linkbutton" icon="icon-ok">Ok</a>
<a href="#" class="easyui-linkbutton" icon="icon-cancel">Cancel</a>
</div>
</form>
</div>

效果图如下：



原文及下载地址：http://jquery-easyui.wikidot.com/tutorial:win1