событие click not triggering

Question

Я не уверен, почему этот код не работает. Возможно, это связано с тем, что флажок находится на странице «coldfusion div». Когда этот флажок установлен, я хочу обновить запись людей.

Функция ReInitialize работает, когда я нажимаю на эту кнопку. Код в полосе зебры таблица работает при начальной загрузке формы, но не при последующих нагрузках, когда она помещается в себя. Невозможно попасть в функцию щелчка. Я могу установить точку останова в Firebug, и она никогда не останавливается.

<script type="text/javascript"> 
$(document).ready(function() { 
    $('#ReInitialize').click(function() { 
     var ReInitAnswer = confirm('Are you sure you want to start over from scratch?'); 
     if (ReInitAnswer) { 
      $.ajax({ 
       type: "POST", 
       url: "cfc/basic.cfc?method=TruncateTemp", 
       error: function (xhr, textStatus, errorThrown) { 
        // show error 
        alert(errorThrown); 
       } /* 
       , 
       success: function (msg) { 
        alert("Data Saved: " + msg); 
       } */ 
      }); 
      $('#ReInitialize').attr('checked', true); 
     } else { 
      alert('canceled'); 
     } 
    }); 

    var table = $('#articles'), 
     rows = table.find('tr'), 
     cells, background, code; 

    for (var i = 0; i < rows.length; i += 1) { 
     cells = $(rows[i]).children('td'); 
     code = $(cells[0]).value(); 
     if (code % 2 == 0) { 
      background = '#e29e6e'; 
     } else { 
      background = '#f9cf80'; 
     } 
     $(rows[i]).css('background-color', background); 
    } 

    $('.notdupe').bind('change', function() { // <---------------------- 
     // If checked 
     if ($(this).is(":checked")) { 
      $.ajax({ 
       type: "POST", 
       url: "cfc/basic.cfc?method=SetNotDupe", 
       data: "indivNum=" + $(this).value() + "&SetValue=" + $(this).checked(), 
       error: function (xhr, textStatus, errorThrown) { 
        // show error 
        alert(errorThrown); 
       } 
      }); 
     } 
    }); 
}); 
</script> 

<cfif qPages.not_dupe_flag> 
    <input class="notdupe" type="checkbox" name="indivID" value="#userid#" checked /> 
<cfelse> 
    <input class="notdupe" type="checkbox" name="indivID" value="#userid#" /> 
</cfif> 

Я изменил его с события click на событие изменения.

Answer 1

Вы пробовали использовать .on() вместо .click()?

Заменить:

$('#ReInitialize').click(function() {

С:

$('#ReInitialize').parent().on('click', '#ReInitialize', function() {

Я не ясно, что весь ваш код делает, но если #ReInitialize заменяется на какой-то момент, вы потеряете обработчик кликов. Эта реализация .on() будет применяться к #ReInitialize и любым последующим экземплярам.

P.S. если вы используете более старую версию jQuery, это будет .live('click', function() {

Answer 2

Похоже, что он должен правильно связываться. Но я думаю, что существует проблема с областью действия с вызовом AJAX внутри функции $('.notdupe').bind().

В коде $.ajax.data, я думаю, что $(this) больше не относится к $('.notdupe'), но к событию AJAX. Кроме того, я не уверен, что должен делать .checked().

$('.notdupe').bind('change', function (e){ 
    // If checked 
    if ($(this).is(":checked")) { 
     $.ajax({ 
      type: "POST", 
      url: "cfc/basic.cfc?method=SetNotDupe", 
      data: "indivNum=" + $(e.target).value() + "&SetValue=" + $(e.target).is(":checked")), 
      error: function (xhr, textStatus, errorThrown){ 
       // show error 
       alert(errorThrown); 
      } 
     }); 
    } 
});