(纯属记录,如果写的不好请言语温柔,谢谢。)

问题:鼠标移动时改变图片,鼠标移开后图片复原。但是因为这段代码是在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; width: 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);

}