Jquery ui 主干提线木偶onDomRefresh jquery ui单击多次触发

我已经定义了一个木偶视图，我需要反映模型更改事件。我的初始化函数如下所示：

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

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

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
    });
 }

当模型嵌套了一些模型更改事件，并且单击函数触发的次数越来越多时，问题就出现了。我一直在寻找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方法会触发两次。我不知道怎么解决这个问题。任何想法都非常受欢迎。

我在onDomRefresh函数的Begining中添加了此调用，该函数将解除元素上所有事件的绑定：

this.$el.unbind();

现在，单击事件在重新渲染视图后仅触发一次