Измените размер отдельного динамически созданного ввода текста на keyup, у которого есть несколько братьев и сестер с одним и тем же классом.

Любая помощь будет оценена по этому поводу, пожалуйста. Я пытаюсь изменить размер динамически созданного ввода текста при нажатии клавиши. Я могу заставить это работать на базовом уровне, но у меня возникают проблемы с изменением размера отдельных входов, которые имеют один и тот же класс, т.е. вместо изменения размера только одного отдельного поля ввода изменяются размеры всех текстовых входов с классом «.question».

Вот мой код:

function resizeInput(theInputField) {
  var getInputWidth = $(theInputField).width();
  if(getInputWidth < 400){
    $(theInputField).attr('size', $(theInputField).val().length);
  }
}

$('#question-list').on('keyup', '.question', function(){
  resizeInput('.question');
});

$('#question-list') --> Это элемент ul.

$('.question') --> Это динамически созданный ввод[type="text"] в указанном выше ul.


jquery keyup
person Ben Clarke    schedule 13.10.2013    source источник

Ответы (1)


arrow_upward
1
arrow_downward

В вашем обработчике событий this — это элемент, вызвавший событие. Вы можете сделать что-то вроде этого:

function resizeInput($theInputField) {      
  var inputWidth = $theInputField.width();
  if(inputWidth < 400){
    $theInputField.attr('size', $theInputField.val().length);
  }
}

$('#question-list').on('keyup', '.question', function(){
  resizeInput($(this));
});
person Jason P    schedule 13.10.2013
comment
Я знаю, что это было задано некоторое время назад, но спасибо! Вы действительно правильно использовали $(this). Я мог бы корить себя за то, что не понял этого! :) - person Ben Clarke; 03.06.2014