2

作成した配列の値を別のdivに追加しようとしていますが、配列の値を追加すると、追加した値だけでなく、配列のすべての値が追加されます（クリックして）。 、 前もって感謝します！

HTML

<div id="products">
    <ul>
        <li><p>Lorem 1</p><button class="target">Add</button></li>
        <li><p>Lorem 2</p><button class="target">Add</button></li>
    </ul>
</div>
<div id="cart">
    <ul>

    </ul>
</div>

jQuery

$(document).ready(function(){

    var array = Array();

    $(".target").click(function() {

        array.push($(this).siblings('p').text());

        $.each(array, function(index, value) {

            $("#cart ul").append("<li>"+value+"</li>");
        });


    });
});

[追加]をクリックすると、最初のボタンが表示されます

Lorem 1

しかし、2番目のボタンの追加をクリックすると表示されます

Lorem 1 Lorem 1 Lorem 2

4

4 に答える 4

1

配列にアイテムを追加します。これは、追加されたアイテムのリストを保持する場合に意味がありますが、リストにアイテムを追加するときに配列をループして、既存のアイテムにすべてのアイテムを追加します。そこの。

最後のアイテムを追加するだけです。

array.push($(this).siblings('p').text());
$("#cart ul").append("<li>" + array[array.length - 1] + "</li>");

または、アイテムを追加する前にリストをクリアできます。

array.push($(this).siblings('p').text());
$("#cart ul").empty();
$.each(array, function(index, value) {
  $("#cart ul").append("<li>" + value + "</li>");
});
于 2013-03-25T16:40:23.440 に答える
0

配列の各要素をループするため、すべての要素を取得します。クリック関数に$.eachを付けずに試してみてください、それはより良いでしょう。

于 2013-03-25T16:35:49.303 に答える
0

セレクターがクリックされたときに1つの値だけを追加する場合は、次の$(".target")ようにする必要があります。

  // assuming you want the last value in the array.
  var value = array[array.length-1]; // could also do $(this).siblings('p').text()
  $("#cart ul").append("<li>"+value+"</li>");

配列は必要ないようです（他の関数でも使用されている場合を除く）。

于 2013-03-25T16:36:36.470 に答える
0

LIVE DEMO

$(function(){

  var array = [];

  $(".target").click(function() {

     array.push( $(this).siblings('p').text() );
     $("#cart ul").append("<li>"+ array[array.length -1] +"</li>");

  });

});
于 2013-03-25T16:37:20.600 に答える