jquery - 即使点击了子元素，如何获取父元素的数据属性

Question

在Backbone events(View)中单击时，我试图获取 div 的数据属性。

如果我单击 div，我可以实现这一点，listItem但如果我要单击子元素跨度，它将失败，因为$(e.target)将是跨度。

那么如何获取父元素的data属性，即使子元素被点击了呢？

<div class="listItem" data-showInfo="true">
    <span class="arrow"></span>
</div>

events:{
  "click .listItem": function(e) {

    var $listItem= $(e.target);

    console.log($listItem.data('showInfo'));
  }
}

Answer 1

使用event.currentTarget而不是event.target，它将被设置为.listItem独立于您单击的 DOM 节点的选择器

var V = Backbone.View.extend({
    events: {
        'click .listItem' : function(e) {
            console.log($(e.currentTarget).data('showinfo'));
        }
    }
});

还有一个演示http://jsfiddle.net/nikoshr/QyP3Z/

Answer 2

你可以这样做：

$('.arrow').click(function(){
alert($(this).parent().attr('data-showInfo'));
});

你的例子在这个JSFiddle

Answer 3

events:{    
    "click .arrow": function(){
        console.log($(this).parent('.listItem').attr('data-showInfo'));
    };
}