向按钮添加事件不适用于 Backbone.js

bn31dyow 于 2022-11-10 发布在其他

关注(0)|答案(1)|浏览(130)

我读了20多篇不同的文章和论坛主题，尝试了不同的解决方案，但我没有科普它。下面的代码不工作。我需要有人的帮助...
LoginView.js

var LoginView = Backbone.View.extend({   
    //el: $('#page-login'),
    initialize: function() {
        _.bindAll(this, 'gotoLogin', 'render');
        //this.render();
    },

    events: {
        'click #button-login': 'gotoLogin'
    },

    gotoLogin : function(e){
        e.preventDefault(); 
        $('#signup-or-login').hide();           
        $('#login').show();
        return true;
    }       
});

login.html

<div data-role="page" id="page-login">

<!-- SignUp or Login section-->
<div id="signup-or-login" data-theme="a">
    <a data-role="button" data-theme="b" id="button-signup"> Sign Up </a>
    <a data-role="button" data-theme="x" id="button-login"> Login </a>      
</div>

<!-- Login section--> 
<div id="login" data-theme="a">
    <button data-theme="b"> Login </button>
    <button data-theme="x"> Cancel </button>
</div>

</div>

该页面是在Backbone.Router扩展类的方法中创建的。

loadPage('login.html', new LoginView());

backbone.js

来源：https://stackoverflow.com/questions/19541056/adding-events-to-button-doesnt-work-with-backbone

1条答案

按热度按时间

y4ekin9u1#

据我所知，$.mobile.loadPage()获取所需的html并将其附加到DOM。
当前，您正尝试在示例化View之后设置el。
但是，请注意，Backbone.View在示例化时附加了el和$el：

var View = Backbone.View = function(options) {
  ...
  this._ensureElement();
  this.initialize.apply(this, arguments);
  this.delegateEvents();
};

还要注意，View.setElement()通过将一个选择器或jQuery对象传递给View.el来设置$el：

setElement: function(element, delegate) {
  if (this.$el) this.undelegateEvents();
  this.$el = element instanceof Backbone.$ ? element : Backbone.$(element);
  this.el = this.$el[0];
  if (delegate !== false) this.delegateEvents();
  return this;
}

底线：

在示例化el时，需要设置它（在您的示例中，使用提供的jQuery对象）：

// Where `view` is a reference to the constructor, not an instantiated object
var loadPage = function(url, view) {

  $.mobile.loadPage(url, true).done(function (absUrul, options, page) {
    var v,
        pageId = page.attr('id');

    v = new view({
      el: page
    });

    ...
  }

}

现在，您可以这样调用loadPage()：

loadPage('login.html', LoginView);

这为Backbone.View提供了委托事件的$el。

赞(0）回复(0）举报 2022-11-10

我来回答

向按钮添加事件不适用于 Backbone.js

1条答案

底线：

相关问题

热门标签

最新问答