让eventDelegate与backbone.js一起工作

Getting eventDelegate to work with backbone.js

本文关键字:一起 工作 js backbone eventDelegate      更新时间:2023-09-26

我有以下js:

SwitcherView = Backbone.View.extend({
    events: {
        'click li' : 'clickLi',
        'click'    : 'click'
    },
    initialize: function(){
        this.liEl = this.$('li');
        console.log(this.liEl);
    },
    clickLi: function(event){
        console.log('click', event);
    },
    click: function(event){
        console.log('click', event);
    }
});
new SwitcherView({el: $('#viewswitcher')});

和下面的HTML:

<div id="viewswitcher" class="block block-nav">
    <div class="block-title">
        <strong><span>Uw kozijn</span></strong>
    </div>
    <div class="block-content">
        <ul class="items">
            <li id="designer-container" class="ui-state-active ui-state-default">
                <span class="ui-icon ui-icon-designer"></span> Ontwerper
            </li>
            <li id="options-container">
                <span class="ui-icon ui-icon-options"></span> Kleuropties
            </li>
            <li id="notes-container">
                <span class="ui-icon ui-icon-notes"></span> Aantekeningen
            </li>
        </ul>
    </div>
</div>

问题是'click'事件确实工作,但我不能让'click li'工作。

我运行的是backbone.js 0.5.3, underscore.js 1.2.1和jQuery 1.6.4.

当我在jsFiddle中尝试您的代码时,它工作得很好。

愚蠢的问题:您是否通过点击第一行项目(Uw kozijn)来测试它?因为如果你是,它不在列表中…它在它自己的DIV中,所以你不会得到两个事件。然而,如果你点击其他任何东西,它就会像我期望的那样工作。

问题是旧的jQuery验证库,更新该库后,一切都如预期的那样工作!