我需要能够检测由类引用的特定容器内发生的任何单击，如果用户单击任何嵌套元素，则我应该能够检测到该单击并更新标志
<div class="container" >
<div class="x1">
<div class="x2">
<div class="">
<span class="">
<ul class="">
</div>
</div>
我尝试使用jquery，但我更喜欢使用骨干网。
//$(document).on('click','.container', function(e){
//$('.container').delegate("div", "click", function(e) {
当用户单击div中具有容器类的某些嵌套元素时，不确定是否需要使用什么事件。基本上，如果用户在此div之外单击，我需要更新一个标志，但是我不想在侦听整个主体的事件处理程序上拥有较大的作用域。
由于您要求提供骨干网示例，因此以下是如何监听div及其子级的点击的方法。
var View = Backbone.View.extend({
className: "my-test-view",
template: '<div class="container"><div class="x1"><div class="x2">test</div></div></div>',
events: {
'click .container': 'onClick',
},
render: function() {
this.$el.empty().append(this.template);
return this;
},
onClick: function(e) {
console.log("clicked on", e.target, " triggered from ", e.currentTarget);
},
});
var view = new View();
$("body").append(view.render().el);
单击test文本应输出：
clicked on <div class="x2">test</div> triggered from <div class="container">…</div>
使用jQuery，以上内容（大致）等效于：
$('.my-test-view').on('click', '.container', function(e) {
console.log("clicked on", e.target, " triggered from ", e.currentTarget);
});
但是在大多数情况下，这应该足够了：
$('.container').on('click', function(e) {
console.log("clicked on", e.target, " triggered from ", e.currentTarget);
});
不要使用，.children().on(...)因为这将为每个孩子创建一个新的侦听器，并且效率低下。
在div之外检测点击是完全不同的，可以通过多种方法来实现，但没有一种是完美的选择。
看 ：
我个人使用过focus和blur事件（请不要忘记tabindex="-1"元素）。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句