0

我会尽可能多地解释,我只想在鼠标悬停时更改 img 标签的 src{on Hover}; html是

<ul id="nav-tabs" data-tabs="tabs">
  <li id="test" style="list-style: none;" class="active">
   <a href="#home" data-toggle="tabs" ><img src="assets/img/button_home_selected3.png" id="test2"  width="83"/><span  s>Home</span></a>
  </li>
</ul>

li 标签是使用脚本动态添加的

$('.plus').click(function(e) {
 e.preventDefault();
 var li_count = $('#nav-tabs').length;
 if (li_count <= 3){
  if(counter <= 3){
   $('#nav-tabs').append('<li id="test" ><a href="#tab' + counter + '" data-toggle="tabs" ><img src="assets/img/button_home_plain1.png" width="83" id="test2">Tab' + counter + '</span><button type="button" class="close">&times;</button></a></li>');
} else { alert("Only 3 Tabs Allowed!")};
}

还有一个活动标签可以在选项卡之间切换,这是使用脚本完成的

$('li#test').each(function() {
if($(this).hasClass('active'))
 {//Active class is applied
  $(this).children().children().attr("src", "assets/img/button_home_selected3.png");
 }
 else
 {
  $(this).children().children().attr("src", "assets/img/button_home_plain.png");
 }

});

我尝试了一些东西,但它不起作用,可能是我把它放错地方了,我只是不知道

$('#test2').hover(function(e) {
  e.preventDefault();
  if ($(this).attr('src') == 'assets/img/button_home_plain1.png')
  {
   $(this).attr('src','assets/img/button_home_mouseOver1.png');
  }
}); 
4

1 回答 1

0

您可以尝试使用.data()来跟踪原始 URL 和.on()(jQuery >= 1.7) 来注册事件的回调:

$("#nav-tabs").on("mouseover", "#test2", function(){
    $(this).data("originalSrc", $(this).attr("src"));
    $(this).attr("src", "assets/img/button_home_mouseOver1.png");
});

$("#nav-tabs").on("mouseout", "#test2", function(){
    $(this).attr("src", $(this).data("originalSrc"));
});

http://api.jquery.com/on/

于 2013-02-12T12:10:36.367 回答