#javascript #jquery
#javascript #jquery
Вопрос:
Следующее
$('input[type = text]').on('keyup', function (e) {
});
отлично работает со статически созданным элементом управления
<input id="txtSearch" type="text" class="col-md-12 col-sm-12 col-xs-12 col-lg-12">
но не запускается при элементах управления, созданных динамически и отображаемых как
<input type="text" class="form-control" id="idName" name="textBox">
с помощью смеси ajax json-ответа и html.
jQuery.each(response.controls, function (index, item) {
var input = jQuery("<div class='form-group'><input type='text' class='form-control' id='" item.id "' name='textBox'></div>");
jQuery('#fields').append(input);
});
Что я здесь делаю не так?
Ответ №1:
Для динамически созданного элемента используйте делегированное событие:
$('body').on('keyup', 'input[type=text]' function (e) {
Ответ №2:
Поскольку ваш <div class='form-group'><input type='text' class='form-control' id='" item.id "' name='textBox'></div>
является динамическим элементом.
Вам необходимо привязать событие ввода ключа после его добавления. Например.
jQuery.each(response.controls, function (index, item) {
var input = jQuery("<div class='form-group'><input type='text' class='form-control' id='" item.id "' name='textBox'></div>");
jQuery('#fields').append(input);
inputevent();
});
function inputevent() {
$('input[type = text]').off('keyup').on('keyup', function (e) {
});
}
Ответ №3:
Попробуйте следующее:
jQuery(document).on('keyup','input[type = text]',function(){
//execute your code, when dynamically added content is keyupped
});
Ответ №4:
catchKeyup(id) {
// code here...
}
jQuery.each(response.controls, function (index, item) {
var input = jQuery("<div class='form-group'><input type='text' class='form-control' id='" item.id "' onkeyup='catchKeyup(" item.id ")' name='textBox'></div>");
jQuery('#fields').append(input);
});
Если вы создаете ввод с помощью любого ответа на запрос. Возможно, вам следует использовать общую функцию для keyup. Таким образом, вы могли бы использовать функцию ввода keyup.
Ответ №5:
Для элемента, динамически добавляемого в DOM, вам необходимо привязать событие к ним с помощью on()
$(document).on("keyup",'input[type=text]', function(){
//do your work
});