简体   繁体   中英

backbone.js - toggle element

I use toggle() for an element. When user clicked a link content slide down and clicked again content slide up.

I use this code for toggle:

var LastItem = Backbone.View.extend({
    el: '#item-div',
    render: function(){
        var itemListObj = this;

        items.fetch({
            success: function(){
                var itemTemplate = _.template($('#item-list-template').html(), {items: items.models, item_meta: items.meta});
                itemListObj.$el.html(itemTemplate);
                $('#img-loading-item').css('display', 'none');
            }
        });
    },
    events: {
        'click .feed-item'      : 'itemSlideDown',
        'click #load-more'      : 'loadMoreItem'
    },

    itemSlideDown: function(e){
        var tog = 0;
        var itemId = $(e.currentTarget).attr('id');
        $('#itemview-'+itemId).toggle(function() {
            alert('a');
        },
        function(){
            alert('b');
        });
    },

    loadMoreItem: function(e){
        var moreLink = $(e.currentTarget);
        var nextUrl = moreLink.data('url');

        moreLink.remove();


        var appendItems = new AppendItemView();
        appendItems.render({url: nextUrl});

    }
});

I get just b on alert().

How I can fix this?

Try this (without toggle):

itemSlideDown: function(e){
    var tog = 0;
    var itemId = $(e.currentTarget).attr('id');
    var $item = $('#itemview-'+itemId);
    if($item.hasClass("show")){
      alert("show!");
      //behavior to show effect
      $item.addClass("hide").removeClass("show");
    }else if($item.hasClass("hide")){
      alert("hide!");
      //behavior to hide effect
      $item.addClass("show").removeClass("hide");
    }else{
      alert("show!");
      //your default behavior if class isn't any (Show for me)
      $item.addClass("hide");
    }
},

i hope it can help (sorry 4 my bad english!).

Example HERE

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM