jQuery翻转问题

Question

我做了一个图片悬停效果（第一次不用教程自己做），想知道是否有一种方法可以在图像以 over.jpg 结尾时终止脚本，并在图像没有以 over.jpg 结尾时继续执行脚本。

这是我的代码：

$('#topNav a img').hover(function(){
    var rSrc = $(this).attr('name');
    $(this).attr('src','images/' + rSrc + 'over.jpg');
}, function(){
    var rSrc = $(this).attr('name');
    $(this).attr('src', 'images/' + rSrc + '.gif');
});

html

    <a href="index.html" class="nav"><img src="images/m_1over.jpg" name="m_1"/></a>
<a href="aboutus.html" class="nav"><img src="images/m_2.gif" name="m_2"/></a>

我尝试添加了

标签

。

if($('img[src$=.gif]')

在脚本之前，但它不起作用...

- Baruch

Answer 1

这样怎么样：

$('#topNav a img').not("[src$=over.jpg]").hover(function(){ ...

See http://api.jquery.com/not/

- karim79

---

非常感谢，不知道为什么我没想到这个，我以前用过 .not。 - Baruch

Answer 2

您可以像这样使用not()方法：

$('#topNav a img').not('#topNav a img[src=over.jpg]').hover(function(){...}

- Sarfraz

---

#top是什么？源代码应该以over.jpg结尾，我有什么遗漏吗？ - karim79

@karim79：那是个打字错误，已经更新了，谢谢。至于名称，我觉得图像名称应该是over.jpg，或者src$=over.jpg或src*=over.jpg，具体取决于文件名。 - Sarfraz

Answer 3

You mean, you need something like this?

$('#topNav a img').each(function(i, el) {
   if ($(el).attr('src').match('\\.gif$') == '.gif') 
   {
           $(el).hover(function(){
              var rSrc = $(this).attr('name');
              $(this).attr('src','images/' + rSrc + 'over.jpg');
           }, 
           function(){
              var rSrc = $(this).attr('name');
              $(this).attr('src', 'images/' + rSrc + '.gif');
           });
   }
}

您可以在这里玩弄选择器，我在这里测试了代码：http://jsfiddle.net/Exceeder/NE3Ps/

- Alex Pakka