[英]jQuery how to get data-value where class active?
我想获取该类处于活动状态的数据值。 当我单击导航选项卡时,它会警告未定义如何解决此错误? 请帮我。
HTML:
<ul class="nav nav-tabs">
<li class="active" data-value="buy"><a data-toggle="tab" href="#home">BUY</a></li>
<li data-value="rent"><a data-toggle="tab" href="#home">RENT</a></li>
<li><a href="Post_Property.html">SALE</a></li>
</ul>
jQuery的:
$(".nav-tabs").click(function(){
alert($(".active").attr("data-value"));
})
$('.nav-tabs').on('shown.bs.tab', function (e) { alert($(".active").attr("data-value")); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> <ul class="nav nav-tabs"> <li class="active" data-value="buy"><a data-toggle="tab" href="#home">BUY</a></li> <li data-value="rent"><a data-toggle="tab" href="#home">RENT</a></li> <li><a href="Post_Property.html">SALE</a></li> </ul>
我已经更新了您可以使用show.bs.tab方法进行引导的代码更改。
您可以获取如下数据属性:
$(".active").data("value");
它将返回data-value
并且在您的情况下,DOM没有正确遍历。 正确的代码是:
$(".nav-tabs").click(function(){
alert($(this).find(".active").data("value"));
})
由于.active
是.nav-tabs
的子.nav-tabs
,因此您必须遍历它。
只需遍历并获得活动标签,如下所示:
$(".nav-tabs").click(function(){
alert($(this).find(".active").attr("data-value"));
});
另外,可以使用data("value")
代替attr('data-value')
data("value")
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.