jquery弹出div层

一，页面引入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"/>男 &nbsp;&nbsp;
         <input name="gender" type="radio" value="Y"/>女&nbsp;&nbsp;
 </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>