(纯属记录,如果写的不好请言语温柔,谢谢。)
问题:鼠标移动时改变图片,鼠标移开后图片复原。但是因为这段代码是在js中自动生成。所以不能够用hover()事件。
html代码:
<div class='navigation-down-inner'>
<span>
<a href='"+towNodes[o].url+"?navId="+towNodes[o].id+"'>
<p> <img class='imgPath' src='"+towNodes[o].picPath+"' onmouseover='overShow(this)' onmouseout='outClose(this)'></p>
<div style='border-bottom:3px solid #f18a22; 26px; margin: 0 auto; margin-bottom: 15px; margin-top: 10px'></div>
</a>
</span>
<input type='hidden' class='picPath' value='"+towNodes[o].picPath+"'/><input type='hidden' class='picImg' value='"+towNodes[o].picImg+"'/>
</div>
js代码:
鼠标移上时事件:
function overShow(obj){
//得到当前的img标签的父标签p,p的父标签a,a的父标签span,span同级的第二个input标签的值
var en=$(obj).parent().parent().parent().nextAll('input').eq(1).val();
//改变当前img标签的src属性
$(obj).attr("src",en);
}
鼠标移出时事件
function outClose(obj){
////得到当前的img标签的父标签p,p的父标签a,a的父标签span,span同级的第一个input标签的值
var en=$(obj).parent().parent().parent().nextAll('input').eq(0).val();
//改变当前img标签的src属性
$(obj).attr("src",en);
}