Question

<ul>
    <li><a id="tab1" data-index="0" name="tab" href="#">abc</a></li>
    <li><a id="tab2" data-index="1" name="tab" href="#">def</a></li>
    <li><a id="tab3" data-index="2" name="tab" href="#">ijk</a></li>
</ul>

这是我的问题
如果我点击任何Anchor标签，我想获得所选项目的[data-index]值。
并且我不应该使用Id选择器或类选择器

这是我尝试使用jQuery，但它没有工作

$("a[name=tab]").on("click", function () { 
    var a = $(this).getAttribute("data-index"); 
    alert(a); 
});

谢谢你

Answer 1

在jquery中使用.attr()

 $("a[name=tabs]").on("click", function () { 
            var a = $(this).attr("data-index"); 
            alert(a); 
        });

或在jquery中使用.data()

 $("a[name=tabs]").on("click", function () { 
            var a = $(this).data("index"); 
            alert(a); 
        });

Fiddle

Answer 2

您可以使用 .data() ：

返回指定数据存储区中第一个元素的值 jQuery集合，由数据（名称，值）或HTML5数据设置 - * 属性。

var a = $(this).data("index");

另请注意，您的name锚点tab不是tabs，因此您需要使用：

$("a[name=tab]").on("click", function () { 
    var a = $(this).data("index"); 
    alert(a); 
});

<强> Fiddle Demo

Answer 3

您可以使用：

$("a[name=tabs]").on("click", function () { 
    var a = $(this).data('index'); 
    alert(a); 
});

我肯定会看看这个link，因为它显示了HTML 5的变化以及我们如何使用jQuery从HTML 5数据属性中有效地获取信息。

Answer 4

使用.data()：

$(this).data('index')

使用jquery获取锚标记的数据值

4 个答案: