JQuery对话框与Ajax应用-优快云博客

>>> [color=red][b]下篇Ajax动态读取XML加载select Option！[/b][/color]<<<

<HTML>
<HEAD>
<TITLE> Jquery 弹出对话框 </TITLE>
<META NAME="Description" CONTENT="Jquery弹出层">
</HEAD>
<link href="css/jqModal.css" rel="stylesheet" type="text/css" />
<link href="css/dialog.css" rel="stylesheet" type="text/css"/>
<script language="javascript" src="js/jquery.js" ></script>
<script language="javascript" src="js/jqModal.js"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#dialogMsgDIV').jqm({
modal : true
});
});
//至少选择一项
function checkOne(){

var eles=document.getElementsByName("cbxArr");
var ids="";
for(var i=0,len=eles.length;i<len;i++){
if(eles[i].checked){
ids+=eles[i].value+",";
}
}
var idsStr=ids.substring(0,ids.length-1);
if(idsStr != "" && idsStr != null && idsStr != ''){
jQuery('#dialogMsgDIV').jqmShow();
}else{
alert("请至少选择一个！");
return false;
}
}
//提交隐藏div的form
function submitMsgForm(){
if(submitMesgForm()){
document.messageForm.submit();
}
}
//验证div留言
function submitMesgForm(){
if(document.Form.title.value=="") {
alert("请填写标题");
return false;
}
if(document.Form.content.value=="") {
alert("请填写备注");
return false;
}
jQuery('#dialogMsgDIV').jqmHide();
return true;
}
</script>
<BODY>
<br/>
<br/>
<table width="516" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>
<td width="516" height="52" valign="top" align="center">
<input type="checkbox" name="cbxArr" id="cbxArr" />岁
<input type="checkbox" name="cbxArr" id="cbxArr" />月
<input type="checkbox" name="cbxArr" id="cbxArr" />之
<input type="checkbox" name="cbxArr" id="cbxArr" />梦
</td>
</tr>
<tr>
<td height="167" valign="top" align="center"> <input type="button" οnclick="checkOne();" value="弹出对话框..."></td>
</tr>
</table>

</BODY>
</HTML>

<div id="dialogMsgDIV" class="jqmWindow" >
<form id="Form" name="Form" method="post" action="">
<div class="tags" id="messageDIV" >
<div class="tags_title" id="loginTopDIV">岁月之梦</div>
<div class="tags_content">
<table id="dialogMsgTable">
<tr>
<td class="tags_td01" width="30%">标题：</td>
<td width="70%" height="25">
<input type="text" name="title" id="title" style="width: 220px"/>
</td>
</tr>
<tr>
<td class="tags_td01" valign="top"><br/>备注：</td>
<td valign="top" >
<textarea name="content" id="content" rows="6" style="width: 220px"></textarea>
</td>
</tr>

</table>
<div class="tags_button">
<p align="center">
您可以选择以下信息:

<select name="leaveWord" id="leaveWord" οnchange="sendRequest()">
<option value="">请关注下篇</option>
</select>

</p>
</div>
<div class="tags_button">
<p align="center">
<input type="button" value="确定提交" style="width: 100px" οnclick="submitMsgForm();"/>
<input type="button" value="取消" style="width: 100px" οnclick="jQuery('#dialogMsgDIV').jqmHide();" />
</p>
</div>
</div>
</div>
</form>
</div>

Jquery 弹出层