求js前辈指点迷津....为什么我下面这段代码鼠标第一次移入的时候提示框显示不出来啊?
<!--<!DOCTYPEhtml><html><headlang="en"><metacharset="UTF-8"><title>test</title><style...
<!--
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>test</title>
<style>
#prompt{
position: relative;
}
#iconT{
width: 13px;
height: 13px;
background: url("../img/iconT.jpg");
position: absolute;
left: 10px;
top: 20px;
display: none;
z-index: 999;
}
#promptText{
width: 200px;
font-family: "微软雅黑";
font-size: 12px;
-ms-word-wrap: break-word;
word-wrap: break-word;
background: rgba(0,0,0,0.7);
*background: #292929;
color: #fff;
position: absolute;
left: 0;
top: 33px;
padding: 10px;
display: none;
z-index: 999;
}
</style>
</head>
<body>
<a href="#" id="prompt" onmouseover="hover(this)">
<span>提示</span>
<div id="iconT"></div>
<div id="promptText">的冯绍峰的是否是非法法规的冯绍峰的是否是非法法规的冯绍峰的是否是非法法规</div>
</a>
<script>
function hover(obj){
var child1 = obj.children[1];
var child2 = obj.children[2];
obj.onmouseover = function(){
child2.style.display ="block";
child1.style.display ="block";
};
obj.onmouseout = function(){
child2.style.display = "none";
child1.style.display = "none";
};
}
</script>
</body>
</html>-->
//我随便alert一个东西是正常的,我想应该是我javaScript代码出了问题,可我找不出原因是关键 展开
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>test</title>
<style>
#prompt{
position: relative;
}
#iconT{
width: 13px;
height: 13px;
background: url("../img/iconT.jpg");
position: absolute;
left: 10px;
top: 20px;
display: none;
z-index: 999;
}
#promptText{
width: 200px;
font-family: "微软雅黑";
font-size: 12px;
-ms-word-wrap: break-word;
word-wrap: break-word;
background: rgba(0,0,0,0.7);
*background: #292929;
color: #fff;
position: absolute;
left: 0;
top: 33px;
padding: 10px;
display: none;
z-index: 999;
}
</style>
</head>
<body>
<a href="#" id="prompt" onmouseover="hover(this)">
<span>提示</span>
<div id="iconT"></div>
<div id="promptText">的冯绍峰的是否是非法法规的冯绍峰的是否是非法法规的冯绍峰的是否是非法法规</div>
</a>
<script>
function hover(obj){
var child1 = obj.children[1];
var child2 = obj.children[2];
obj.onmouseover = function(){
child2.style.display ="block";
child1.style.display ="block";
};
obj.onmouseout = function(){
child2.style.display = "none";
child1.style.display = "none";
};
}
</script>
</body>
</html>-->
//我随便alert一个东西是正常的,我想应该是我javaScript代码出了问题,可我找不出原因是关键 展开
1个回答
展开全部
首先 hover事件 就是onmouseover onmouseout两个事件的合成事件 hover(function(1),function(2)),进入执行1函数 离开执行2函数。而你这个问题是相当于两个onmouseover了 扯着麻烦 自己记着不能这样就可以了 而且非要你这么写的话 你就把
obj.onmouseover = function(){
child2.style.display ="block";
child1.style.display ="block";
};
改成try1(child2,child1);
再在<script>里面hover函数前或者后写上这个
function try1(q,a){
q.style.display ="block";
a.style.display ="block";
}
能解决你这个问题
很多时候 我们都不说不清问题的详细原因是什么,但是心里要有个大概 ,然后记着这个问题。后面学多了慢慢自己就明白了。 -----------by:菜鸟一枚
obj.onmouseover = function(){
child2.style.display ="block";
child1.style.display ="block";
};
改成try1(child2,child1);
再在<script>里面hover函数前或者后写上这个
function try1(q,a){
q.style.display ="block";
a.style.display ="block";
}
能解决你这个问题
很多时候 我们都不说不清问题的详细原因是什么,但是心里要有个大概 ,然后记着这个问题。后面学多了慢慢自己就明白了。 -----------by:菜鸟一枚
追问
ok 解决了,谢谢前辈指点,受教了!
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询