2

以下是我用于单击选项卡功能的代码。

<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,但要显示 3 次。任何人都可以帮助我使用什么而不是附加,以便我获得所需的输出。

4

5 回答 5

3

尝试使用jQuery.one http://jsfiddle.net/aiioo7/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>
于 2013-08-22T10:09:00.920 回答
2

又快又脏,但能胜任

$('div#1').empty();

for (i=0;i<mytabs.length;i++)
    $('div#1').append('<br/>' + mytabs[i] + '<br/>');

它会在添加内容之前清除 div。这是你要求的吗?

于 2013-08-22T09:59:02.783 回答
2

这对我有用: $('div#1').empty(); $('div#1').append('你的代码在这里');

于 2015-05-15T14:08:29.650 回答
1

尝试这个

您的 html 有 3 个 div 元素。首先确定你想要在哪里(在哪个 Div)你想附加标签。下面的代码将在 div 中附加标签,id="1" 。否则它将附加在所有 div 中。

 <script type="text/javascript">
$("a[href=#tabs-1]").click(function()
            {
        $('div#1').empty();
          for (i=0;i<mytabs.length;i++)
            {
              $('div#1').append("<br>"+mytabs[i]+"<br>");
        }
        });
 </script>
于 2013-08-22T10:13:41.893 回答
-1

尝试这个:

$('div').html("<br>"+mytabs[i]+"<br>");
于 2013-08-22T10:00:15.607 回答