3 
<ul>
  <li>item x</li>
  <li>item y</li>
  <li>item z</li>
</ul>
<a href="#">Populate</a>

<li>单击“填充”链接时，我想复制（复制和附加）所有s。我该怎么做？

谢谢

4

4 回答 4

11

快速简洁的版本。

$('a').click(function() {
    $('ul').children().clone().appendTo('ul');
})

当然，您可能希望使用类或 id 来定义您的 'a' 和 'ul' 以便更具体。

编辑：

为了扩展上面给出的免责声明，这将是一个有点脆弱的解决方案，因为它会影响所有 'a' 和 'ul' 元素。这可能不是您想要的。

更好的形式是为您的 html 元素提供类或 id，然后将事件附加到这些元素上。

例子：

$('#myPopulateAnchorElement').click(function() {
 $('#myExpandableUL').children().clone().appendTo('#myExpandableUL');
});

<ul id='myExpandableUL'>
  <li>item x</li>
  <li>item y</li>
  <li>item z</li>
</ul>
<a href="#" id='myPopulateAnchorElement'>Populate</a>

感谢 Ed Woodcock 建议包含先发制人的解决方案。

于 2010-02-04T14:46:32.970 回答
1 
var ul = $('ul');

$('a').click(function(){
    ul.children().clone(true).appendTo(ul);
});
于 2010-02-04T14:49:35.080 回答
1

尝试这个： 

$(function(){
   $('.anchorClass').click(function(){
        var ul = $('.ulClass');
        ul.append(ul.html());
   });
});

编辑：

您需要将 html 更改为： 

  <ul class="ulClass">
  <li>item x</li>
  <li>item y</li>
  <li>item z</li>
</ul>
<a class="anchorClass" href="#">Populate</a>

于 2010-02-04T14:18:29.763 回答
0

你可以这样做：

$('a').click(function(){
   $('li').each(function(){
      $(this).clone().appendTo('your selector where to put the copy');
   })
})
于 2010-02-04T14:22:29.363 回答