easyUI 我的第一个window
@author YHC
创建一个window 非常简单,我们创建一个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> 现在运行你的测试页面,你会看见一个window 显示在你的屏幕上,我们不需要写任何的javascript代码.
如果你希望创建一个隐藏的window,记得设置'closed'属性为true值,你可以调用'open' 方法来打开一个window.
[html]
<div id="win" class="easyui-window" title="My Window" closed="true" style="width:300px;height:100px;padding:5px;">
Some Content.
</div>
<div id="win" class="easyui-window" title="My Window" closed="true" style="width:300px;height:100px;padding:5px;">
Some Content.
</div> [javascript] view plaincopyprint?$('#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>
作者:yhc13429826359
补充:web前端 , HTML 5 ,