Question

我有一个样式元素，隐藏了类'item'。最初页面只有一个这个类的元素。我只是使用这个隐藏元素作为模型，我可以使用jquery抓取并在每次单击“添加项目”按钮时将其插入到列表中，并在内部文本中使用正确的项目名称。

我要做的是克隆这个隐藏的'item'元素，并在最后项元素位于网页上之后插入它。显示它，并将内部文本更改为我需要的任何内容。

我当前的实现没有按预期克隆/插入项目，但我相信它应该，我可能遗漏了一些东西。

我的标记

<div class="item" style="border:1px solid blue; padding:7px; display:none;">hello</div>

添加项目

我的JavaScript

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

   //clone hidden item element blueprint
   $('.item').eq(0).clone().insertAfter('.item:last-child');


   //Change inner text of element
   $('.item:last-child').text("apples").show();
});

的jsfiddle

http://jsfiddle.net/XPVAs/

Answer 1

假设您需要:last选择器，而不是:last-child：

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

    //clone hidden item element blueprint
    $('.item').eq(0).clone().insertAfter('.item:last');


    //Change inner text of element
    $('.item:last').text("apples").show();
});

这是一个演示：http://jsfiddle.net/XPVAs/3/

Answer 2

更改

$('.item:last-child').text("apples").show();

到

$('.item:last').text("apples").show();

仔细阅读以下链接：

http://api.jquery.com/last-child-selector/

http://api.jquery.com/last/

克隆和插入，插入次数超过预期

2 个答案: