jquery - 单击功能中的单击和重新单击功能

Question

我有一个图像，我想在其中调用单击和重新单击功能。所以我使用 .toggle() 函数而不是 .click() 函数，但它隐藏图像而不单击，所以我决定在 中创建单击和重新单击函数>.click() 函数如下:

$('.imgclass').click(function(){
   $(this).addClass('btn');
    if($(this).attr('class','btn')){

        $(this).css('background-color','blue');
        $(this).removeClass('btn');
    } else {
        alert('sorry');
    }
});

但是在我的代码中 else 语句不起作用。在第一次单击中，它将背景颜色添加为蓝色并删除其类，然后它找不到类 btn，因此它应该提醒“抱歉”，但它不会提醒。我认为还有其他最好的想法来在 .click() 函数中创建单击和重新单击功能。如何实现这一点？

demo

Answer 1

$('.imgclass').click(function(){

   $(this).toggleClass('btn');

    if($(this).hasClass('btn')){
        $(this).css('background-color','blue');
    } else {
        alert('sorry');
    }
});

为了使您的 if 案例正常工作，您需要使用 attr 中的 getter:

if($(this).attr('class') === 'btn'){

如果 btn 是按钮上唯一的类，则此方法仅适用于 bat 右侧。不过，我推荐我的方法。