用js控制div显示的问题！
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN " "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns= "http://www.w3.org/1999/xhtml ">
<head>
<link href= "styles/aqua.css " rel= "stylesheet " type= "text/css ">
<link rel= "stylesheet " type= "text/css " href= "styles/my.css " />
<script type= "text/javascript " src= "scripts/prototype-1.4.0.js "> </script>
<script type= "text/javascript " src= "scripts/my.js "> </script>
</head>
<body>
<p> Mailing Address: </p>
<br />
<input type= "button " value= "go " name= "go " id= "go " onclick= "go(); " /> <br />
<div id= "openDiv " class= "aepi ">
<table id= "openDivTable " width= "450 " border= "0 " height= "500 ">
<tr>
<td width= "220 " height= "64 " align= "center " valign= "middle "> Select one option below: </td>
<td width= "220 "> <form name= "form1 " method= "post " action= " ">
<p>
<input name= "button " type= "button " id= "buttonCancel " width= "30 " value= "Cancel " onClick= "cancel(); ">
<input name= "button " type= "button " id= "buttonSave " width= "30 " value= "Save " onClick= "saveCorrectionPage(); ">
</p>
</form> </td>
</tr>
<tr>
<td colspan= "2 " height= "30 ">
<form name= "form2 " method= "post " action= " ">
<p>
<input type= "radio " name= "radiobutton " value= "radiobutton ">
Delete activities including and after </p>
<p id= "activtiesDetail "> <span class= "STYLE18 "> 08-11-2007 07:30:00 Change Appearance MARK </span> </p>
<p id= "activtiesDetailComment " > (maximum of 10 activities allowed) </p>
</form> </td>
</tr>
<tr>
<td colspan= "2 ">
<form name= "form2 " method= "post " action= " ">
<input type= "radio " name= "radiobutton " value= "radiobutton ">
Delete Attendance
</form> </td>
</tr>
<tr>
<td colspan= "2 ">
<form name= "form2 " method= "post " action= " ">
<p>
<input name= "radiobutton " type= "radio " id= "addPoolAttendance " onClick= "showValueField(); " value= "radiobutton " checked= "checked ">
Add Pool Attendance </p>
<p id= "dateAddPoolAttendence "> Date: </p>
<p id= "locationAddPoolAttendence "> Location:
</p>
</form>
</td>
</tr>
<tr>
<td colspan= "2 "> <form name= "form2 " method= "post " action= " ">
<p>
<input name= "radiobutton " type= "radio " id= "changeReasonRadio " onClick= "showReason(); " value= "radiobutton ">
Change Renson </p>
<p> 08-11-2007 07:30:00 Change Appearance MARK </p>
<p class= "STYLE18 "> Rostpone </p>
<p id= "reasonSelect "> Reason:CC Childcare
</p>
</form> </td>
</tr>
<tr>
<td height= "100% " colspan= "2 "> </td>
</tr>
</table>
<p>
<input type= "radio " name= "10 " value= "单选 " />
one
<select name= "select ">
<option value= "Childcare "> CC </option>
<option value= "Adult CareGiver "> CG </option>
</select>
</p>
<p> <br />
<input type= "radio " name= "10 " value= "单选 " />
two
<select id= "locationSelect " name= "select "> <option value= "GJ Grand Jury "> GJ </option> <option value= "Green Valley Justice Court "> GRVJP </option> <option value= "Pima Co.Superior Court "> SVPCT </option> <option value= "Tucson City Court "> CITYCT </option> </select>
</p>
</div>
<input name= "button " type= "button " id= "button " value= "open " onclick= "openDiv(); " />
</body>
</html>
下面是my.css
.aepi {
position:absolute;
left:800;
top:400;
width:600;
height:500;
z-index:20;
filter:alpha(opacity=50); /* IE */
background-color: #CCCCCC;
display:none
}
下面是my.js
function cancel(){
window.close();
}
function saveCorrectionPage(){
// save some data.
window.close();
var displayMessage= '0272 - The requested update was completed successfully. Some activities may note have been deleted due to related juror payment or activity. ';
alert(displayMessage);
}
function mouseDown(ev){
ev= ev||window.event;
var target = ev.target || ev.srcElement;
if(target.id!= 'openDiv '&&target.parentNode.id!= 'openDiv '){
alert( 'id: '+target.parentNode.id+ ' tagname: '+target.parentNode.tagName );
// alert( 'you must close the div ! ');
}
}
function go(){
alert( 'go ');
}
function openDiv(){
document.onmousedown=null;
document.onclick=null;
document.ondblclick=null;
document.onmousemove=null;
document.onmouseout=null;
document.onmouseover=null;
document.onmouseup=null;
document.onkeydown=null;
document.onkeypress=null;
var openDiv=document.getElementById( 'openDiv ');
openDiv.style.display= "block ";
var oDChilds=openDiv.childNodes;
for(var i=0;i <oDChilds.length;i++){
var oDChild=oDChilds[i];
alert( 'id: '+oDChild.tagName);
}
//openDiv.focus();
//alert(openDiv.tagName);
}
我想问下就是在点击open按钮的时候打开一个div层，这时候我需要实现的效果，是除非点击save或者cancel按钮推出这个div层，否则鼠标点击（包括所有的事件）层之外的所有地方的事件都失去效果。
说的简单点，就是只让在这个层上做操作，关闭这个层的时候，才可以操作别的页面。
大家说这个怎么实现啊，跪求啦！很急的，解决了就结贴！
[解决办法]
在加一个覆盖全部的层，在你操作的层下面.设置透明度。
[解决办法]
被你代码吓跑了
[解决办法]
confirm( "点击是保存,或者点击否取消 ")
[解决办法]
给你写段把`
看到效果了吗``` <input type= "button " value= "点不了 "> <input> <input> <input> <input> <input>
<div id= 'x ' align=right style= ";filter:alpha(opacity=30);background:#999;position:absolute;left:0;top:0 ">
<input style= "color:red;font-weight:800 " type= "button " onclick= "this.parentNode.style.display= 'none ' " value= "close panel ">
</div>
<script>
window.onload=function(){
x.style.width=document.body.clientWidth;
x.style.height=document.body.clientHeight;}
</script>
[解决办法]
up
[解决办法]
用个另外个层来遮住整个网页吧
[解决办法]
楼主要的是锁定图层吧？看看这个，应该是楼主要的效果!
<body onmousemove= "moveIt(); " onmouseup= "end(); " ondragstart= "return false; ">
<input type= "button " value= "关闭？ " onClick= "back.style.background= '#333333 ';back.style.filter= 'alpha(opacity=40) ';back.style.visibility= ' ';wnd.style.display= 'inline '; ">
<script>
var isDrag = false;
function execCode(){
var newWin = window.open();
newWin.document.write(tt.value);
}
var oldX=0,oldY=0;
function init(){
isDrag=true;
oldX=event.x;
oldY=event.y;
}
function end(){
isDrag=false;
}
function moveIt(){
if(isDrag){
var x =window.event.x;
var y = window.event.y;
hdl.parentNode.style.left = parseInt(hdl.parentNode.style.left.replace( "px ", " ")) + (x - oldX);
hdl.parentNode.style.top = parseInt(hdl.parentNode.style.top.replace( "px ", " ")) + (y - oldY);
oldX = x;
oldY = y;
}
}
</script>
<div id= "back " onMouseMove= "moveIt(); " onMouseUp= "end(); " style= "position:absolute;left:0;top:0;width:1000;height:660;visibility:hidden; "> </div>
<div id= "wnd " onMouseDown= "init(); " onMouseMove= "moveIt(); " onMouseUp= "end(); " style= "border:1px outset #333333;position:absolute;filter:alpha(opacity=70);top:100;left:200;width:200;height:120;display:none; ">
<div id= "hdl " style= "background:#333377;width:100%;height:20;color:white "> <b> 窗口 </b> </div>
<div style= "background:#dddddd;width:100%;height:100 ">
<input type= "button " value= "确定 " onClick= "opener=null;window.close() "> <input type= "button " value= "取消 " onClick= "back.style.visibility= 'hidden ';wnd.style.display= 'none '; ">
</div>
</div>
</body>