一,页面引入dialog.js、jquery-ui..js、jquery...js
二,在页面加入如下html代码:
<div style="margin-top:20px;">
<input type="button" class="button" style="width:60px;" id="dialogShow" value="弹出一个DIV"/>
</div>
<div id="dialogDiv" style="display:none;">
<span style="font-weight:bold;">姓名:</span>
<input id="mergerStr" class="textbox" style="width:200px;height:18px;border:1px solid #667F99;"/>
<br /><br />
<span style="font-weight:bold;">性别:</span>
<input name="gender" type="radio" value="U"/>男
<input name="gender" type="radio" value="Y"/>女
</div>
三,加入JS代码:
<script type="text/javascript">
$(function(){
$("#dialogDiv").dialog(
{
title: "个人信息", //标题
position: 'top',//显示的位置
width: 320,
height: 160,
modal: true, //创建一个遮罩层
autoOpen: false,//是否dialog方法创建就显示对话框
buttons: {
"确定": function(){
$(this).dialog('close');
},
"取消": function(){
$(this).dialog('close');
}
}
}
);
$("#dialogShow").click(function(){
$("#dialogDiv").dialog("open");
});
});
</script>