2016-07-01 5 views
0

Это мой пример:Не может проверить количество после содержания Аякса нагрузки

$.ajax({ 
    type: "POST", 
    url: "some.php", 
    data: "fname=John&lname=Due", 
    success: function(result){ 
     $('#content').html('Label 1: <input name="quantity[]" class="quantity"> Label 2: <input name="quantity[]" class="quantity">'); 
    } 
}); 

И JS проверить количество

$(".quantity").keydown(function (e) { 
     // Allow: backspace, delete, tab, escape, enter and . 
     if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110]) !== -1 || 
      // Allow: Ctrl+A, Command+A 
      (e.keyCode == 65 && (e.ctrlKey === true || e.metaKey === true)) || 
      // Allow: home, end, left, right, down, up 
      (e.keyCode >= 35 && e.keyCode <= 40)) { 
      // let it happen, don't do anything 
      return; 
     } 
     // Ensure that it is a number and stop the keypress 
     if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) { 
      e.preventDefault(); 
     } 
    }); 
+1

Так как ваш '.quantity' динамически загружены, вам необходимо изменить' $ (" ") количество. KeyDown (функция (е) { 'в' $ (" # содержание"). (На KeyDown , ".quantity", function (e) {' – Sean

+0

, как я объяснил в своем анонсе, вы отвязываете текущие события перед связыванием новых событий. https://jsfiddle.net/q52m0sks/ – asankasri

+0

Посмотрите результат, если этого не сделать unbind https://jsfiddle.net/q52m0sks/1/ (щелкните по динамическим элементам и увидите предупреждения) – asankasri

ответ

1

.html() является функцией, где параметр, который должен быть установлен как новый html является передается при вызове, если не используется шаблон .html(function(index, html){}), где новый html - return ed при обратном вызове функции; не задано как значение свойства, как .innerHTML есть. Заменитель

$('#content').html('Label 1: <input name="quantity[]" class="quantity"> Label 2: <input name="quantity[]" class="quantity">'); 

для

$('#content').html = 'Label 1: <input name="quantity[]" class="quantity"> Label 2: <input name="quantity[]" class="quantity">'; 

Используйте событие делегации приложить keydown событие динамически создаваемых .quantity элементов; или прикрепить событие, когда элемент создается

function handleKeydown(e) { 
     // Allow: backspace, delete, tab, escape, enter and . 
     if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110]) !== -1 || 
      // Allow: Ctrl+A, Command+A 
      (e.keyCode == 65 && (e.ctrlKey === true || e.metaKey === true)) || 
      // Allow: home, end, left, right, down, up 
      (e.keyCode >= 35 && e.keyCode <= 40)) { 
      // let it happen, don't do anything 
      return; 
     } 
     // Ensure that it is a number and stop the keypress 
     if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) { 
      e.preventDefault(); 
     } 
    } 

$('#content') 
.html('Label 1: <input name="quantity[]" class="quantity"> Label 2: <input name="quantity[]" class="quantity">') 
.find(".quantity") 
.keydown(handleKeydown); 
0

.html является метод и не может назначить так следовать, как это для справки http://api.jquery.com/html/

$('#content').html('Label 1: <input name="quantity[]" class="quantity"> Label 2: <input name="quantity[]" class="quantity">'); 
1

Как и другие уже упоминалось, вы должны использовать HTML() работает должным образом.

Кстати, если вы когда-либо создавали html-контент динамически, вы также должны связывать события.

$.ajax({ 
    type: "POST", 
    url: "some.php", 
    data: "fname=John&lname=Due", 
    success: function(result){ 
     $('#content').html = 'Label 1: <input name="quantity[]" class="quantity"> Label 2: <input name="quantity[]" class="quantity">'; 

     $(".quantity").unbind("keydown").bind("keydown", function() { 
      // your validation code should goes here 
     }); 
    } 
}); 
+0

Для справки: http://api.jquery.com/bind/ – asankasri

+0

Пример: https: // jsfiddle .net/q52m0sks / – asankasri

Смежные вопросы