javascript - 如何在具有相同功能的类似div上复制功能

如果我的li包含一个函数（在keyup上复制），那么如何将相同的函数复制到相同li的克隆中。


  这是元素（li，更好地说），将不断重复

<li class="main-item">
 <div class="header-item fwidth">
 <div>
  <h1 class="duplicado fleft"></h1>
 </div>
 </div>
 <div id="internal-items-2" class="collapse collapsible-item">
  <div>
   <input type="text" value="" class="duplicante nombre-item">
  </div>
 </div>
</li>

  这是keyup函数的重复项，该函数根据输入上的内容在H1元素上生成文本

$(function() {
    $('.duplicante').on('keyup', function() {
        var text = $(this).val();
        $('.duplicado').text(text);
    });
});

如何使该功能适用​​于每个重复的li元素？
Fiddle example

最佳答案

如果我理解正确，那么您想要的是在keyup上更新各个标头。

一种方法是这样的：

$(function() {
  $('.duplicante').on('keyup', function() {
    var text = $(this).val();
    $(this).closest('li').find('.duplicado').text(text);
  });
});

这是小提琴：

http://jsfiddle.net/s16vds6n/1/