Событие изменения количества строк в jQuery - PullRequest
Новая
       16

Событие изменения количества строк в jQuery

1 голос
/ 30 марта 2012

На моей странице есть таблица, чьи строки увеличиваются / уменьшаются с помощью ajax. Я хочу иметь событие изменения количества строк, которое получает уведомление при изменении количества строк. Я попробовал пару вещей, но ничего не получалось. Вот что я попробовал: 

$("#myTable tr").length.change(function(){
     alert("row count changed");
 });

, а также 

 $("#myTable tbody").change(function(){
        alert("table changed");
    });

но эти функции не вызываются при увеличении / уменьшении строк. Пожалуйста, предложите

1 Ответ

2 голосов
/ 30 марта 2012

Ваши события изменения не вызываются, потому что событие onChange, то есть событие, с которым метод jQuery change() связывает данный обратный вызов, действительно только для элементов <input>, <select> и <textarea> ( ссылка ).

В частности, ваш первый пример - вызов change() на номер, который должен выдать ошибку. Ваш последний пример вызывает change() для элемента tbody, который не поддерживает событие onChange.

Что касается получения чего-то, что действительно работает, вы можете использовать setInterval() для явной проверки количества строк очень часто: 

setInterval(function(){ 
  if($("#myTable tr").length > 2){
     /* do stuff */ 
   } 
}, 1000);

Это позволит проверить, что число строк больше 2 каждую секунду.

Если возможно, я бы не стал использовать этот подход и вместо этого попытался бы выполнить те же действия, которые вы выполняли бы для мифического события «при изменении строки», в тот момент, когда вы фактически делаете вызовы AJAX. Во всяком случае, вы можете создать пользовательское событие jQuery , которое будет запускаться на элементе <table> после каждого вызова AJAX (например, $("#myTable tr").trigger('my-custom-event'),), который вы затем сможете прослушивать: $("#myTable tr").bind('my-custom-event', function(){ /* do stuff */ })

Если у вас нет контроля или доступа к JavaScript, который запускает вызовы AJAX, которые обновляют ваши строки, другим решением может быть рассмотрение события jQuery ajaxSuccess(), который запускается всякий раз, когда запрос AJAX успешно выполняется на вашей странице. Например: 

$('body').ajaxSuccess(function(){
  if($("#myTable tr").length > 2){
     /* do stuff */ 
   } 
});
...