привязка функции и функция clone () - Jquery - PullRequest
3 голосов
/ 20 марта 2010

У меня проблемы с привязкой клавиш при клонировании элемента. Вот сценарий:

У меня есть 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 и добавить ее к телу:

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

Это все работает, но функция keyup не работает с элементами ввода клонированной строки.

Кто-нибудь может помочь или дать совет? Надеюсь, я был достаточно ясен и обязательно добавлю детали, если это необходимо для решения этой проблемы.

Привет

Ответы [ 3 ]

9 голосов
/ 20 марта 2010

У вас есть два реальных варианта

  • использовать clone(true), что также клонирует связанные обработчики событий
  • использовать делегирование события с live(), чтобы обработчик события был связан с родительским элементом, и, таким образом, вновь добавленные строки получат ту же функциональность
3 голосов
/ 20 марта 2010

Использовать jQuery live events ; таким образом, обработчик будет автоматически привязан к вновь созданным элементам (например, клонам в вашем примере).

Например:

$('.rijbasis input').live('keyup', function()
{
    var parent = $(this).parent().parent();
    $('.total',parent).text(parseInt($('.cost',parent).text()) * parseInt($('.count',parent).val()));
}
2 голосов
/ 20 марта 2010

Используйте .live вместо .keyup

...