Question

<div style='padding:10px;border:1px solid #888;width:150px;' id='btnTest' data-id='1'>
    <label>
      <input type='checkbox' name='test1' />
      TEST1
    </label>
    <label>
      <input type='checkbox' name='test2' />
      TEST2
    </label>
</div>

<script>
$(function() {
  $('#btnTest').click(function(e){
    console.log($(e.target).attr('data-id'));
  })
});
</script>

在该测试代码中，如果单击标签区域，则无法获取data-id值

即使我点击那个DIV标签中的其他元素，我有什么方法可以获得数据ID吗？

Answer 1

 $(this).attr('data-id');

e.target是指单击的元素，这是绑定处理程序的元素。

Answer 2

使用＆＃39;这＆＃39;：

$(function() {
  $('#btnTest').click(function(){
    console.log($(this).attr('data-id'));
  })
});

但是，如果您想要复选框的名称＆＃39;：做：

$(function() {
  $('#btnTest label input').click(function(){
    alert($(this).attr('name'));
  })
});

Answer 3

是的，您可以这样做：

$(function() {
  $('#btnTest').click(function(e){
    console.log($(e.target).parent('#btnTest').attr('data-id'));
  })
});

在Onclick事件中获取标记属性

3 个答案: