Question

如何利用jquery easyui设置对话框

Answer 1

1、实现对话框，首先新建一个jsp页面，去掉设置路径，保证js和css样式的路径的正确性
2、引入对话框所需要的js文件和css样式文件
3、
利用<a></a>制作两个按钮
<div style="margin:20px 0;">
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#updateWin').dialog('open')">打开</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#updateWin').dialog('close')">关闭</a>
</div>
4、
在<div></div>中添加一个table
<div id="updateWin" class="easyui-dialog" title="修改窗口" data-options="iconCls:'icon-save'" style="width:400px;height:300px;padding:10px">
<table>
<tr>
<td>
<label>姓名：</label>
<input type="text"/>
</td>
</tr>
<tr>
<td>
<label>性别：</label>
<input type="text"/>
</td>
</tr>
<tr>
<td>
<label>年龄：</label>
<input type="text"/>
</td>
</tr>
<tr>
<td>
<label>电话：</label>
<input type="text"/>
</td>
</tr>
<tr>
<td>
<label>地址：</label>
<input type="text"/>
</td>
</tr>
<tr>
<td>
<label></label>
<input type="button" value="修改"/>
</td>
</tr>
</table>
</div>
5、启动服务器，在浏览器查看页面，并且点击“关闭”按钮，可以将对话框关闭，如下图所示：