Question

我正在尝试将if else语句添加到下面的

$('#togglediv4').click(function(e){
     e.preventDefault();
    $('#link4').attr('src','images/contact_link_clicked.png');
});

如果没有点击事件，我希望图片更改回原始图片，否则点击后所有链接都会卡在新图片上。

因此，如果未点击图像，我想显示原始图像。

$('#link4').attr('src','images/contact_link_original.png');

Answer 1

使用attr回调函数和三元运算符。

$('#togglediv4').click(function(e){
     e.preventDefault();
     $('#link4').attr('src',function(i, src){
          return src === 'images/contact_link_original.png'
          ? 'images/contact_link_clicked.png'
          : 'images/contact_link_original.png'
     });
});

Answer 2

您只需将原始src代码的<img>属性设置为：mages / contact_link_original.png

然后按上述方式添加click事件。

默认情况下，如果没有点击div，它将包含原始图像。

编辑：根据您的评论我会做以下事情：

为所有图片添加课程
单击任何图像时，将src attr更改回具有该类的所有图像上的原始图像。（您可以使用$('.imgClass')）
然后更新使用新图像单击的图像。

Answer 3

我可能无法正确理解您的问题，但我认为您需要使用mousedown和mouseup事件代替click：

$('#togglediv4').mousedown(function(e){
    e.preventDefault();
    $('#link4').attr('src','images/contact_link_clicked.png');
}).mouseup(function(e){
    e.preventDefault();
    $('#link4').attr('src','images/contact_link_original.png');
});

Answer 4

我认为你正在寻找这样的东西：

$('#togglediv4').click(function(e){
    e.preventDefault();
    if ($('#link4').attr('src') == 'images/contact_link_original.png') {
        $('#link4').attr('src','images/contact_link_clicked.png');
    }       
});

javascript if else点击事件

4 个答案: