3

我有以下主干视图:

core.views.Login = Backbone.View.extend(
{
    el: '#main-content-wrapper',

    events:
    {
        'focus #username': 'usernameFocus',
        'blur #username': 'usernameBlur'
    },

    initialize: function()
    {
        this.render();
    },

    render: function()
    {
        var html = unlocked.renderTemplate('login', 'core');
        this.$el.empty().html(html);

        $('#username').focus();

        return this;
    },

    usernameFocus: function(event)
    {
        console.log('focus');
        if($(event.target).val() == 'Username')
        {
            $(event.target).val('');
        }
    },

    usernameBlur: function(event)
    {
        if($(event.target).val() == '')
        {
            $(event.target).val('Username');
        }
    }
});

我遇到的问题是,当我这样做时: $('#username').focus(); : 在渲染中是 :usernameFocus : 事件尚未附加。我能想到的解决方案只有两个。

  1. 使用 setTimeout - 虽然这个选项在技术上可行,但我不认为它是一个真正的选项
  2. 在渲染中手动应用事件 - 这样做会完全绕过 Backbone 提供的事件系统,这看起来很奇怪。

Backbone 是否为我提供了一种在应用所有事件后运行 jQuery 代码的方法?

4

2 回答 2

1

实际上,我只是将该代码从视图的渲染方法中移出并移到了实际生成视图的路由器方法中,无论如何这似乎是一个更好的地方。

于 2012-04-19T10:18:56.807 回答
1

在焦点设置代码之前将事件处理程序映射到事件的一种简单方法是调用 Backbone 本身提供的相同绑定代码。您应该可以致电:

this.delegateEvents();
this.render();

在您的初始化中并获得您想要的效果。

于 2012-04-19T13:44:43.987 回答