使用jquery的Data-id属性

data-id attribute using jquery?

本文关键字：属性 Data-id jquery 使用      更新时间：2023-09-26

我正在使用jQuery。我需要得到点击项目的data-id，并将其传递给web服务。我如何获得data-id属性?

我的HTML是这样的:

<ul class="nav nav-pills">
    <li class="onselectedCategory" data-id="12"><a href="javascript:;;">12</a></li>
    <li class="onselectedCategory" data-id="23"><a href="javascript:;;">23</a></li>
    <li class="onselectedCategory" data-id="34"><a href="javascript:;;">34</a></li>
    <li class="onselectedCategory" data-id="45"><a href="javascript:;;">45</a></li>
    <li class="onselectedCategory" data-id="56"><a href="javascript:;;">56</a></li>
</ul>

我的JavaScript是这样的:

events{
      "click li.onselectedCategory": "selectCategory"
    }
selectCategory: function(event){
      event.preventDefault();
        var _selectedValue = $(this).data('id'); 
        alert("Selected Value : "+_selectedValue);
    },

试试这个:

$(".onselectedCategory").click(function(){ 
    alert($(this).data("id")); 
});

onselectedCategory是一个类，因此您需要使用.而不是用于id的#来引用它。

change #data-id to data-id 

 $(".onselectedCategory").click(function(){ 
   alert($(this).attr("data-id")); 
 })

编辑主干

 selectCategory: function(event){
        event.preventDefault();
        var selectedValue = "";
        if($(e.target).is('li')) {
            selectedValue =$(e.target).attr('data-id');
        } else {
           selectedValue =$(e.target).parent().attr('data-id');
        }       
        alert("Selected Value : "+ selectedValue);
    },

onselectedCategory类必须在标签<a> 

<li><a class="onselectedCategory" data-id="12" bla,bla,bla...</li>
$(".onselectedCategory").click(function(){ alert($(this).data("id")); });
相关文章：