骨干视图点击复选框监听器

<!DOCTYPE HTML > 
<html> 
<head> 
    <meta charset="UTF-8"> 
    <title>Title</title> 
</head> 
<body> 

     <script src="jquery.js"> 
    </script> 

    <script src="underscore.js"> 

    </script> 
    <script src="backbone.js"> 
    </script> 
    <script> 
     var View = Backbone.View.extend({ 

      el: '#listen_to_box', 

      events: { 
       'click [type="checkbox"]':'clicked', 
      }, 
     clicked : function(event) { 
      console.log("events handler for "+ this.el.outerHTML); 
     } 
    }); 

    </script> 

    <div id="listen_to_box"> 
     <input type="checkbox" /> 
    </div> 

</body> 
</html>

单击该复选框时，单击的函数没有被调用，请帮助我将复选框上的单击事件的监听器函数关联起来。谢谢骨干视图点击复选框监听器

来源

2013-07-29 Karthic Rao

你的问题是当你定义你的View类时，你传递的是el，而不是在你实例化View类时传递它。试试这个：

var View = Backbone.View.extend({ 
    events: { 
     'click [type="checkbox"]': 'clicked', 
    }, 
    clicked: function (event) { 
     console.log("events handler for " + this.el.outerHTML); 
    } 
}); 

// Pass in el when instantiating the view 
new View({ 
    el: $("#listen_to_box") 
});

看到一个working fiddle here。

来源

2013-07-29 15:36:24 Lukas

它不工作尚未:( –

你的代码看起来很完美。您已经定义了Backbone View称为View和活动连接时尝试创建视图中的一个新的实例。所以该事件就未安装..

只需创建一个新的实例，您的代码应工作。

var view = new View();或new View()应该做

Check Fiddle

你的代码的页面上遇到的元素之前运行。为了使它工作，你要么需要在结束标记之前移动代码或包住里面Document Ready handler

$(function() { 
    // Your code here 
});

来源

2013-07-29 16:32:49

我试了一下，仍然不工作:(没有任何东西在控制台上点击复选框打印:(请帮我解决这个问题 –

看起来像你的脚本在元素出现在屏幕上之前运行..在'document.ready '事件 –

非常感谢你Sushanth，现在的工作:)非常感谢你:) –

change to 
clicked: function (event) { 
    console.log("events handler for " + this.$el.outerHTML); 
}

你的代码看它是否有助于

来源

2013-08-02 12:30:31 Max

骨干视图点击复选框监听器

回答

相关问题