0

我正在尝试根据点击更改图像。就像交替点击应该有不同的图像来源。类似于 slideToggle 的东西。我看到有些人使用toggleClass，但是还有其他方法可以实现吗？

我的代码如下：

    $(document).ready(function(){
        $("img").click(function(){
            if ($("img").attr("src","down.png"))
            {
                $(this).attr("src","up.png");
            }

            else if ($("img").attr("src","up.png"))
            {
                $(this).attr("src","down.png");
            }
           })

    })

但不幸的是，它没有进入 else if 循环。

4

4 回答 4

1

除了其他答案所做的修复之外，您还需要在$(this)整个功能中使用。$("img").attr("src")将获得src页面上的第一张图片，而不是被点击的图片。

$(document).ready(function(){
    $("img").click(function(){

        if ($(this).attr("src") == "down.png") {
            $(this).attr("src","up.png");
        }

        else if ($(this).attr("src") == "up.png") {
            $(this).attr("src","down.png");
        }

    })
})
于 2013-06-10T16:41:04.500 回答
1

您的if条件错误，您需要一个布尔表达式：

if ($("img").attr("src") == "down.png") {
...
} else if ($("img").attr("src") == "up.png") {
..
}

您最初的检查$("img").attr("src","down.png")实际上是将图像源设置为down.png，而不是检查它。

另外，我相信你真的想要这个：

if ($(this).attr("src") == "down.png") {
...
} else if ($(this).attr("src") == "up.png") {
..
}

您的代码只会评估第一张图片的来源（在您页面上的所有图片中），此代码会检查点击图片的来源。

于 2013-06-10T16:37:20.277 回答
0

您没有在 if 中测试匹配，也.prop()不要.attr()在src.

您还需要$(this)在点击处理程序中使用，而不是$('img').

$(document).ready(function(){
    $("img").click(function(){
        if ($(this).prop("src") == "down.png") {
            $(this).prop("src","up.png");
        } else if ($(this).prop("src") == "up.png") {
            $(this).prop("src","down.png");
        }
    });
})
于 2013-06-10T16:39:32.633 回答
0

尝试

$(document).ready(function(){
    $("img").click(function(){
        var t = $(this);
        if (t.attr("src") == "down.png") {
            t.attr("src","up.png");
        }

        else if (t.attr("src") == "up.png") {
            t.attr("src","down.png");
        }

       });
});

我可能会将其简化为

$(document).ready(function(){
     $("img").click(function(){
        var rc =  $(this).attr("src") == "down.png" ? 'up.png' : 'down.png';
         $(this).attr("src", rc);
     });
});

那条线翻译成这样的东西

var variable = (if statement true) ? (give value for true) : (give value for false)

然后将值直接保存在variable

于 2013-06-10T16:37:22.680 回答