Question

我正在玩一些Jquery，json和Ajax。

如果点击了fa-plus，它需要消失，并且需要显示电子邮件。问题是它没有做任何事情。甚至没有console.log（＆＃39;点击＆＃39;）

我已准备好文档并且：$(document).on('click', '.open', function() {}

我迷失在这里..希望你们能帮忙。

$(document).ready(function(){
    Cocktail.getAll().done(function(data){
        var list = $('.list-group');

        for (var i = 0; i < data.cocktails.length; i++) {
            list.append('<li class="list-group-item"><h3>' + data.cocktails[i].name + '</h3><i class="fa fa-plus"><i class="fa fa-minus hide"></i>');
        }

    }).fail(function(data){
        console.warn('fetching failed');
        console.warn(data);
    }).always(function(){
        console.log('this is what I always do');
    });


    var open = $('.fa-plus');
    var close = $('.fa-minus');

    $(document).on('click', '.open', function() {
        console.log('clicked');
        $(this).addClass('hide');
        close.removeClass('hide');

    });
});

Answer 1

只需在单个元素上更新类，而不是维护两个元素。然后你不需要显示/隐藏。

$(document).on('click', '.fa', function() {
  $(this).toggleClass("fa-plus fa-minus");
});

添加Jquery后单击事件

1 个答案: