jquery 弹出框

一下为两个弹出框的样子，当然这个根据自己的需求设置样式
先引入下面js
<script type="text/javascript"src="http://image.tianji.com/js/jqueryUI.js">
</script>
此为jquery一个控件
<div id="showBoxId" style="display:none;border:1px solid #7EABCD;">
<div id="titleId" style="background:#BED5FF;padding:15px;font-weight:bold;TEXT-ALIGN: left;"><fmt:message key="label.group.core.membermange.rejectreason"/></div>
<textarea id="reasonId" style="width: 280px; height: 80px;overflow-x:hidden;overflow-y:hidden"></textarea>
<input type="button" id="refuseYes" value="<fmt:message key="button.group.core.membermange.submit"/>"/><input type="button" id="refuseNo" value="<fmt:message key="button.group.core.membermange.cancel"/>"/>
</div>

<div id="blacklistConfirmBox" style="display:none;border:1px solid #7EABCD;">
<div style="background:#BED5FF;padding:15px;font-weight:bold;TEXT-ALIGN: left;"><fmt:message key="message.group.core.membermange.blacklist.confirm"/></div>
<input type="button" id="blacklistConfirm" value="<fmt:message key="button.group.core.membermange.submit"/>"/><input type="button" id="blacklistCancel" value="<fmt:message key="button.group.core.membermange.cancel"/>"/>
</div>

两个对话框有了
就出发什么显示着两个对话框，并让背景置灰
<script>
$("#refuseYes").bind("click",function(){
$("#_eventId").val("ban");
if($("#reasonId").val()==""){
alert("<fmt:message key="error.group.core.membermanage.reason.required"/>");
}else{
$("#reason").val($("#reasonId").val());
$("#manageForm").submit();  
$.unblockUI();
$("#reason").val("");
$("#reasonId").val("");
  return false;
}

});
$("#refuseNo").bind("click",function() {
$.unblockUI();
$("#reasonId").val("");
  return false;
});

$("#ban").click(function(){
if(checked()){
$.blockUI({ overlayCSS:{backgroundColor: "#EFEFEF"}, message: $("#showBoxId")});
//$("#_eventId").val("ban");
//$("#manageForm").submit();
return false;
}

});



$("#blacklistConfirm").bind("click",function(){
$("#_eventId").val("blacklist");
$("#manageForm").submit();  
$.unblockUI();
$("#reason").val("");
$("#reasonId").val("");
return false;

});
$("#blacklistCancel").bind("click",function() {
$.unblockUI();
$("#reasonId").val("");
  return false;
});

$("#blacklist").click(function(){
if(checked()){
$.blockUI({ overlayCSS:{backgroundColor: "#EFEFEF"}, message: $("#blacklistConfirmBox")});
//$("#_eventId").val("blacklist");
//$("#manageForm").submit();
return false;
}
});

$("#selectAll").change( function() {
$(".memberIdBox").attr("checked", $(this).attr("checked")); //全选钮
});

$("#grantAdminship").click(function(){
if(checked()){
$("#_eventId").val("grantAdminship");
$("#manageForm").submit();
return false;
}
});
function checked(){
var isChecked = false;
$("input[@type=checkbox]",".memberMngTbale").each(
function(){
if($(this).attr("checked")){
isChecked=true;
return;
}
})
if(!isChecked){
alert("<fmt:message key="error.group.core.membermanage.memberids.required"/>");
}
return isChecked;
} //判断是否有选中的元素，如果没有的话，不允许提交

</script>