下面是我的用于点击选项卡功能的代码。
<body>
<div class="row-fluid">
<div class="span1 offset1">
<div class="tabbable" align="center">
<ul class="nav nav-tabs nav-stacked">
<li class="active"><a href="#tabs-1" data-toggle="tab">Eat</a>
</li>
<li><a href="#tabs-2">Drink</a>
</li>
</ul>
</div>
</div>
<div id="1"></div>
</div>
<script type="text/javascript">
$("a[href=#tabs-1]").click(function() {
for (i = 0; i < mytabs.length; i++) {
$('div').append("<br>" + mytabs[i] + "<br>");
}
});
</script>
</body>
这里我使用 javascript 将选项卡的值存储在数组中
<script>
$(function() {
$("#tabbable").tabs();
});
var i;
var mytabs = new Array();
mytabs[0] = "Saab";
mytabs[1] = "Volvo";
mytabs[2] = "BMW";
</script>
现在我希望在单击选项卡后显示存储在数据中的值。但是我的代码在做什么,它显示数据的次数与数据存储在数组中的次数一样多。意味着我想要输出为 Saab、Volvo、BMW,但显示了三次。任何人都可以帮助我在这方面使用什么而不是追加,以便我获得所需的输出。
最佳答案
尝试使用jQuery.one
http://jsfiddle.net/adiioo7/UFBzn/1/
JavaScript:-
var i;
var mytabs = new Array();
mytabs[0] = "Saab";
mytabs[1] = "Volvo";
mytabs[2] = "BMW";
$(function () {
$(".tabbable").tabs();
$("a[href^=#tabs-]").one("click", function () {
for (i = 0; i < mytabs.length; i++) {
$($(this).attr("href")).append("<br>" + mytabs[i] + "<br>");
}
});
});
HTML:-
<div class="row-fluid">
<div class="span1 offset1">
<div class="tabbable" align="center">
<ul class="nav nav-tabs nav-stacked">
<li class="active"><a href="#tabs-1" data-toggle="tab">Eat</a>
</li>
<li><a href="#tabs-2">Drink</a>
</li>
</ul>
<div id="tabs-1"></div>
<div id="tabs-2"></div>
</div>
</div>
</div>
关于javascript - 如何使用jquery只追加一次数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18377188/