函数绑定和 clone() 函数 - Jquery答案

【问题标题】：function binding and the clone() function - Jquery函数绑定和 clone() 函数 - Jquery
【发布时间】：2010-03-20 15:36:43
【问题描述】：

克隆元素时，我的 keyup 绑定出现问题。这是场景：

我有一个这样的 html 标记：

<tr class="rijbasis">
   <td>
      <input type="text" class="count" />
   </td>
   <td>
       <span class="cost">10</span>
   </td>
   <td>
       <span class="total">10</span>
   </td>
</tr>

我正在将一个 keyup 函数绑定到我的表格行的输入元素，如下所示：

$('.rijbasis input').keyup(function(){
    var parent = $(this).parent().parent();
     $('.total',parent).text(parseInt($('.cost',parent).text()) * parseInt($('.count',parent).val()));
}

我设计了这样的函数，因此我可以在 onclick 事件上克隆表格行并将其附加到 tbody：

$('.lineadd').click(function(){
        $('.contract tbody').append($('.contract tbody tr:last').clone());
        $('.contract tbody tr:last input').val("0");
 });

这都可以，但是 keyup 函数对克隆行的输入元素不起作用..

有人可以提供帮助或建议吗？我希望我足够清楚，如果需要解决这个问题，我肯定会添加细节。

问候

【问题讨论】：

呵呵，谢谢 :) 我真的很喜欢这里的即时帮助社区

标签： jquery function binding clone

【解决方案1】：

你有两个真正的选项

使用clone(true) 也会克隆绑定的事件处理程序
将事件委托与live() 结合使用，以便事件处理程序绑定到父元素，因此新添加的行将获得相同的功能

【讨论】：

酷，不知道！如果你只打算克隆，那么使用这个，我认为它会比 .live 表现更好。
谢谢你拯救了我的一天

【解决方案2】：

使用jQuery的live events；这样，处理程序将自动绑定到新创建的元素（例如您示例中的克隆）。

例如：

$('.rijbasis input').live('keyup', function()
{
    var parent = $(this).parent().parent();
    $('.total',parent).text(parseInt($('.cost',parent).text()) * parseInt($('.count',parent).val()));
}

【讨论】：

我有一个半相关的问题，与这个答案有相同的基础。非常感谢！

【解决方案3】：

使用.live 代替.keyup

【讨论】：