单击按钮无法调用视图功能主干

Question

我试图在单击按钮时调用视图函数，但我发现了这个问题 ，但仍然无法到达视图函数。

HTML：

<form class="addToCart-form">
    <input type="button" id="addToCart" class="addToCart" value="Add To Cart" />
</form>

查看：

var CartView = Backbone.View.extend({
   events : {
       "click : #addToCart" : "addToCart"
   },
   addToCart : function (){
        console.log('saved');
        return false;
   },
   render: function(){
      $("#list").html("string");
       $("#rightpanel").html("another string");
   }
});

我尝试在router console.log ，并且render()正常工作，但addToCart函数除外。

任何帮助，将不胜感激。

Answer 1

例如，您需要首先为此视图分配el值

 var CartView = Backbone.View.extend({
   el: '.addToCart-form', 
   events : {
       "click : #addToCart" : "addToCart"
   },
   addToCart : function (){
        console.log('saved');
        return false;
   },
   render: function(){
      $("#list").html("string");
       $("#rightpanel").html("another string");
   }
});

之后，您可以像在元素id的基础上一样添加事件处理程序（更好的方法是在用户元素类中附加事件）。 然后，您将能够访问表单元素，例如

this.$el.find('#addToCart')