如何使用jquery只追加一次数据

How to append data only once using jquery

本文关键字:一次 数据 何使用 jquery 追加      更新时间:2023-09-26

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

<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>

现在,我希望在单击选项卡后,应该显示存储在数据中的值。但我的代码所做的是,它显示数据的次数与数据存储在数组中的次数一样多。意味着我想输出萨博,沃尔沃,宝马,但显示了三次。有人能在这方面帮助我使用什么而不是附加,这样我就能得到想要的输出吗。

尝试使用jQuery.onehttp://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>

快速而肮脏,但能完成的工作

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

它将在添加内容之前清除div。这就是你想要的吗?

这对我很有用:$('div#1').empty();$('div#1').append('yourcodehere');

试试这个

您的html有3个div元素。首先,请确保要将选项卡附加到所需的位置(在哪个Div中)。下面的代码将在id="1"的div中附加制表符。否则,它将在所有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>

试试这个:

$('div').html("<br>"+mytabs[i]+"<br>");