我可以得到帮助纠正下面的代码吗?你可以复制粘贴并尝试自己。Onmouseover
弹出div出现。如果我点击X弹出div应该关闭,但它没有。只有双击X关闭弹出div。Onmouseover
它应该总是显示弹出div虽然。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<style type="text/css">
.container {
display:block;
width:500px;
height:200px;
border:1px solid green;
}
.advert {
float:right;
overflow:hidden;
width:100px;
height:30px;
border:1px solid red;
}
.close {
float:right;
width:20px;
height:28px;
cursor:pointer;
border:1px solid black;
}
</style>
<body>
<div class="container" onmouseover='getad(39);' onmouseout='hidead(39);changeback(39);'>
<div class='advert' id="39" style="display:none;"><div class="close"><a href="javascript:closead(39)">X</a></div></div>
<input type="text" value="1" id="ad39" />
</div>
<div class="container" onmouseover='getad(40);' onmouseout='hidead(40);changeback(40);'>
<div class='advert' id="40" style="display:none;"><div class="close"><a href="javascript:closead(40)">X</a></div></div>
<input type="text" value="1" id="ad40" />
</div>
<script type="text/javascript">
function getad(number) {
if(document.getElementById('ad'+number).value==1) {
if(document.getElementById(number).style.display == "none") {
document.getElementById(number).style.display = "block";
}
}
}
function hidead(number) {
if(document.getElementById('ad'+number).value==1) {
if(document.getElementById(number).style.display == "block") {
document.getElementById(number).style.display = "none";
}
}
}
function closead(number) {
document.getElementById('ad'+number).value = 0;
if(document.getElementById(number).style.display == "block") {
document.getElementById(number).style.display = "none";
}
}
function changeback(number) {
if(document.getElementById('ad'+number).value==0) {
document.getElementById('ad'+number).value = 1;
}
}
</script>
</body>
</html>
3条答案
按热度按时间ql3eal8s1#
您的ID错误:
应为:
vawmfj5a2#
我在firefox上试过你的代码,它很好用。
在IE8中,它不起作用。
这就是为什么你不应该写原生Javascript的主要原因...
使用JQuery或其他JS框架。
首先,它会让你的代码跨浏览器兼容,其次,只需1行代码就能做你需要做的事情;-)
类似于$(#39). hide()或$(#39). show()的内容
blpfk2vs3#
问题不在于你的广告没有被移除,而在于为了点击触发hidead()函数的链接,你还必须将鼠标悬停在鼠标悬停时触发getad()的div上。
所以如果你逐步执行这些动作,实际上执行的是这个。
“X-link”标签上的Click事件触发器closead(number)触发并执行其代码。Mouseout事件触发并传播到父hidead(number)触发并执行。Mouseover事件触发并传播到父getad(number)触发并执行。
所以你的活动被卸载,然后立即重新加载。也许如果你能提供一些上下文,我们可以帮助你使这个可行。我不知道在什么情况下,你想加载一个广告在mouseover,隐藏它在mouseout,然后给予用户一个关闭按钮。这看起来像是很多加载/卸载/ Flink 的内容这将惹恼你的访问者比简单地有一个静态广告,每X秒通过 AJAX 或东西重新加载。