Question

只是一个简单的问题，我如何在第一次点击时将jquery告诉action1，当用户再次点击时，它应该执行操作然后重新启动操作？例如：用户点击之类的，文本应该改为不同，当用户按下不同时，它应该改为喜欢，等等..

<a href="#" class="like">Like</a>

$('.like').click(function(){
//ajax
    $(this).html('Remove like');
},function(){
    $(this).html('like');
});

但它似乎只工作一次，就像用户点击它时更改为删除之类的，当我再次点击时没有任何事情发生

Answer 1

使用jquery toggle handler。

.toggle( handler(eventObject), handler(eventObject) [, handler(eventObject)] )

handler(eventObject)  A function to execute every even time the element is clicked.
handler(eventObject)  A function to execute every odd time the element is clicked.
handler(eventObject)  Additional handlers to cycle through after clicks.

E.g：

$('.like').toggle(function() {
    //ajax
    $(this).html('Remove like');
}, function() {
    $(this).html('like');
});

Answer 2

尝试：

var first = true;

$('.like').click(function(){
  if(first){
    $(this).html('Remove like');
    first = false;
}else{

    $(this).html('like');
    first = true;
}
});

可替换地：

var first = true;

$('.like').click(function(){
  var text = "";
    ($(this).html() == "like"){
       text = "Remove like";
    }else{
       text = "like";
    }
    $(this).html(text)
});

Answer 3

您可以按照以下方式执行此操作

HTML

<a href="#" class="like" id="button">Like</a>

Jquery的

$("#button").click(function(event){
    event.preventDefault();

    if($(this).hasClass('like'))
    {

        $(this).html('Remove like');
        $(this).removeClass("like");
        $(this).addClass("unlike");
    }else{

        $(this).html('like');
        $(this).removeClass("unlike");
        $(this).addClass("like");
    }

});

直播Demo

编辑：更简单

$("#button").click(function(){
    if($(this).hasClass('like'))
    {        
        $(this).html('Remove like');
        $(this).toggleClass("like unlike");

    }else{        
        $(this).html('like');
        $(this).toggleClass("like unlike");
    }

});

jquery单击替换，再次单击替换

3 个答案: