点击div即可获取data-id的值

我有以下div:

     <div id="icon2323" data-id="2343434"  style="color: #0076c0;" data-toggle="collapse" data-target=".detail" class="fa fa-chevron-down"></div>

在我的查询代码中,我具有以下内容:

         $('div[id^="icon"]').on('click',function (e) {
             alert('here'); 
             // var dataId = $(e).data("id"); did not work              
         });  

我尝试过:

  var dataId = $(e).data("id"); and tried to display the value but showed undefined. 

我的问题是在这种情况下如何获取data-id的值。

rzf018575 回答:点击div即可获取data-id的值

只需使用jQuery的.data()方法:

$('div[id^="icon"]').on('click',function(e) {
  alert( $(this).data('id') );
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="icon2323" data-id="2343434" style="color: #0076c0;" data-toggle="collapse" data-target=".detail" class="fa fa-chevron-down">abc</div>

使用普通JavaScript,您可以使用dataset属性:

var el = document.querySelector('div[id^="icon"]');
el.addEventListener("click",function() {
  alert(this.dataset.id);
},false);
<div id="icon2323" data-id="2343434" style="color: #0076c0;" data-toggle="collapse" data-target=".detail" class="fa fa-chevron-down">abc</div>

本文链接:https://www.f2er.com/3156472.html

大家都在问