<html xmlns="
http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
<script language="javascript">
//-----------------------人员多选下拉菜单-----------------------------
/*隐藏人员多选下拉列表div*/
function hideMultiDropDownDiv(){
document.getElementById("multiDropDownDiv").style.display = "none";
}
/*显示人员多选下拉列表div*/
function showMultiDropDownDiv(inputid){
//注意，具体位置自行调整
document.getElementById("multiDropDownDiv").style.pixelLeft = document.getElementById(inputid).offsetLeft + document.getElementById(inputid).parentElement.offsetLeft+320 ;
document.getElementById("multiDropDownDiv").style.pixelTop = document.getElementById(inputid).offsetTop + document.getElementById(inputid).parentElement.offsetTop+115;
var is = document.getElementById("multiDropDownTableDiv").getElementsByTagName("input");
for (var i=0;i<is.length;i++){
is[i].checked = false;
}
document.getElementById("multiDropDownTableDivCmd").innerHTML = "<INPUT class=button onClick=javascript:fetchValOfMdd('"+inputid+"') type=button value= 确 定 > <INPUT class=button onClick=javascript:hideMultiDropDownDiv() type=button value=关闭>";
document.getElementById("multiDropDownDiv").style.display = "block";
}
/*全选*/
function chkall(e)
{
if(form1.MAID)
{
form1.MAID.checked=e.checked;
for(i=0;i<form1.MAID.length;i++)
if(form1.MAID[i].disabled!=true) form1.MAID[i].checked=e.checked;
}
}
function chkall1(e)
{
if(form1.SMID)
{
form1.SMID.checked=e.checked;
for(i=0;i<form1.SMID.length;i++)
if(form1.SMID[i].disabled!=true) form1.SMID[i].checked=e.checked;
}
}
/*获取人员多选值*/
function fetchValOfMdd(inputid){
var emplNames = "";
var emplIds = "";
var is = document.getElementById("multiDropDownTableDiv").getElementsByTagName("input");
for (var i=0;i<is.length;i++){
if(is[i].checked == true){
if(emplNames == "")
emplNames = emplNames+is[i].value;
else
emplNames = emplNames+","+is[i].value;
if(emplIds == "")
emplIds = emplIds+is[i].value;
else
emplIds = emplIds+","+is[i].value;
}
}
document.getElementById(inputid).innerText = emplNames;
hideMultiDropDownDiv();
}
</script>
</head>
<body>
<form id="form1" runat="server">
<p><font face="Verdana" size="2"> 先看下效果：<input id="mddSelectedValue" style="BORDER-RIGHT: gray 1px solid; BORDER-TOP: gray 1px solid; BORDER-LEFT: gray 1px solid; BORDER-BOTTOM: gray 1px solid" /> <a href="javascript:showMultiDropDownDiv('mddSelectedValue')">选择人员</a></font></p>
<p><font face="Verdana" size="2">代码如下：</font></p>
<p> </p>
<!--人员多选下拉菜单div -->
<div id="multiDropDownDiv" style="BORDER-RIGHT: gray 1px solid; BORDER-TOP: gray 1px solid; DISPLAY: none; Z-INDEX: 99; BORDER-LEFT: gray 1px solid; BORDER-BOTTOM: gray 1px solid; POSITION: absolute; BACKGROUND-COLOR: #FFFFFF; layer-background-color: #FFFFCC; left: 153px; top: 81px;">
<div id="multiDropDownTableDiv" style="PADDING-LEFT: 10px; OVERFLOW: auto; WIDTH: 275px; PADDING-TOP: 10px; HEIGHT: 300px">
<table width="250" cellpadding="0" cellspacing="0" style="BORDER-RIGHT: gray 0px solid; BORDER-TOP: gray 0px solid; BORDER-LEFT: gray 1px solid; BORDER-BOTTOM: gray 1px solid" barder="0">
<tbody>
<tr>
<td colspan="6" align="center" style="BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; BORDER-LEFT: 0px solid; WIDTH: 250px; BORDER-BOTTOM: 0px solid">
<div align="right">
<input id="checkall" onClick="chkall(this)" type="checkbox" value="全部人员" name="checkall">
全选</div></td>
</tr>
<tr>
<td height="20" align="center" bgcolor="#D0E1F3" style="BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; BORDER-LEFT: 0px solid; WIDTH: 250px; color:#0066FF; font-weight:bold; BORDER-BOTTOM: 0px solid">11111111</td>
</tr>
<tr>
<td style="BORDER-RIGHT: 1px solid; BORDER-TOP: 1px solid; BORDER-LEFT: 0px solid; BORDER-BOTTOM: 0px solid">
<input type="checkbox" name="MAID" value="" />
111111111 </td>
</tr>
</tbody>
</table>
</div>
<div id="multiDropDownTableDivCmd" style="FONT-SIZE: 10pt; LEFT: 55px; PADDING-BOTTOM: 4px; PADDING-TOP: 8px; POSITION: relative"></div>
</div>
</form>
</body>
</html>