Question

这是我的HTML代码单击单元格时如何获取数据属性的值？

<td id = "orderIds" data-cids="213,431">orders</td>

单击<td>单元格时，我应该使用什么来触发事件？

Answer 1

请检查下面提到的解决方案。

＆＃13;

$('td').click(function(){
    alert($(this).data('cids'));
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
  <td id = "orderIds" data-cids="213,431">orders</td>  
  <td data-cids="23,43">12</td>
  <td data-cids="21,41">23</td>
  <td data-cids="13,31">34</td>
</tr>
</table>

＆＃13;

Answer 2

通过使用has-attribute selector（可选）选择单元格并使用data()方法获取数据属性值来绑定单击事件处理程序。

$('td[data-cids]').click(function() {
  console.log($(this).data('cids'));
  // or use `this.dataset.cids` 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td data-cids="213,431">orders</td>
    <td data-cids="123,234">orders</td>
  </tr>
</table>

Answer 3

您需要点击单元格数据属性，因此使用此功能将需要。使用以下代码段，它应该可以工作。

$('td').click(function(){
        var data = $(this).data('cids');
 })

Answer 4

使用纯粹的js ......

orderIds.onclick=function(){
  console.log(this.dataset.cids)
}

您也可以将$('#orderIds)与jQuery一起使用

获取单击特定单元格时的数据属性

4 个答案: