Backbone Marionette onDomRefresh jquery-ui点击多次射击

时间:2014-04-01 09:21:59

标签: jquery-ui backbone.js marionette

我已经定义了一个木偶视图,我需要反映模型更改事件。我有这样的初始化函数:

initialize: function(){
    _.bindAll(this,"render");
    this.model.on('change',this.render);
},

后来,我在onDomRefresh方法中定义了我的jquery-ui元素初始值设定项。它是一个可拖动且可调整大小的元素,当您单击它时可以写入。单击元素外部时,将保存文本。

onDomRefresh: function(){
    var self = this;
    if(this.$el.resizable()){
        this.$el.resizable('destroy');
    }
    this.$el.resizable({ handles: "n, e, s, w, se, sw, nw, ne" });
    this.$el.on('resize', function (e) {
        e.stopPropagation();
    });

    this.$el.draggable().click(function(e){
        $(".selected").removeClass("selected");
        $(this).addClass("selected");
        $(this).draggable( "option", "disabled", true );
        $(this).attr('contenteditable','true');
        $(this).css({cursor:'text'});
        $(this).css({opacity:'100'});
    }).blur(function(){
        $(this).draggable( 'option', 'disabled', false);
        $(this).attr('contenteditable','false');
        $(this).css({cursor:'move'});
        self.textchange(); //update and save the text in the model
    });
 }

问题出现了,当模型嵌套了一些模型更改事件,并且click函数触发的次数越来越多。我一直在寻找jquery点击事件解决方案,但它们似乎都不适合我。

尝试过的解决方案:

this.$el.draggable().unbind("click").click(function(e){});
this.$el.draggable().off("click").on('click',function(e){});
this.$el.draggable().one('click', function(e){});
//with jquery sparkle
this.$el.draggable().once('click', function(e){});

我还注意到有时onDomRefresh方法会触发两次。不知道如何解决这个问题。任何想法都受到欢迎。

1 个答案:

答案 0 :(得分:0)

我在onDomRefresh()函数的开头添加了这个调用,它取消绑定元素上的所有事件:

this.$el.unbind();

现在,点击事件在重新渲染视图后仅触发一次。