Javascript If / Else语句更改img src

Question

我有一个功能下降的动态下拉菜单，我想添加一些功能。 菜单是页面导航，悬停在链接上会更改内容区域中图像的来源，反映活动链接。 这是一个简单的attr（src）变化。

我添加了一些代码来淡化活动图像，将源更改回默认值，然后在退出菜单时将其淡化并返回，但是想在If / Else语句中构造该代码; 如果图像的源与默认值不变，则防止图像淡出和重新进入。

语法似乎正确，但功能无法正常工作。 我比较新，很可能会遗漏一些东西。 我非常感谢任何有关功能，更可靠代码的建议！

谢谢你的时间，丹尼尔

---

嵌入在else语句中的函数（淡出，更改源，淡入）按照我的意愿工作。

$("#trigger").mouseleave(function(){
    var img = $("#img_home");
    if (img.src = "Images/IMG_4663_bw.jpg"){
      img.noop();
    } else {
      img.fadeOut(1000, function(){
         img.attr("src","Images/IMG_4663_bw.jpg");
         img.fadeIn(1000);
      });
    }
});

Answer 1

if (img.src = "Images/IMG_4663_bw.jpg")

您正在分配值，您需要==运算符，而不是=运算符。
如果您只是在寻找else条件，只需反转条件：

if (img.attr('src') != "Images/IMG_4663_bw.jpg") {
    // fade and stuff
}

Answer 2

img是一个jQuery对象。
您需要通过调用img.attr('src')来访问其属性。

你的if条件赋予 img属性; 要检查是否相等，您需要使用== （相等）或=== （严格相等）运算符。

jQuery的noop方法是一种静态方法; 你通过编写jQuery.noop()调用它。

最后，根本不需要调用noop() 。 首先，一对没有语句的空括号没有错： if (something) { } else { ... } 。
此外，你可以反转if条件并摆脱else ：

if (img.attr("src") === "Images/IMG_4663_bw.jpg") {
  img.fadeOut(1000, function() {
     img.attr("src", "Images/IMG_4663_bw.jpg").fadeIn(1000);
  });
}

Answer 3

尝试

$("#trigger").mouseleave(function(){
var img = $("#img_home"); 
 if (img.src == "Images/IMG_4663_bw.jpg"){
  img.noop(); 
 } 
 else {
  img.fadeOut(1000,function(){
  img.attr("src","Images/IMG_4663_bw.jpg");
  img.fadeIn(1000); 
  }); 
 } 
});

不同之处在于将该源与图像路径字符串进行比较。 它应该是'=='

Answer 4

语法不正确。 在if()语句中需要==而不是= ，它执行赋值而不是比较。

此外，为了直接访问src属性，您需要从DOM元素执行此操作。 您可以使用[0]从jQuery对象获取第一个img 。

if (img[0].src == "Images/IMG_4663_bw.jpg"){
    $.noop(); // The noop is called from the global jQuery object.
    //...