Почему этот jQuery blur () не работает? - PullRequest
1 голос
/ 03 декабря 2011

Вот код:

$("#textBox").focus(function() {
  $("#textBox").replaceWith('<textarea id="textBox">' + $(this).val() +'</textarea>');
});

$("#textBox").blur(function() {
    $("#textBox").replaceWith('<input type="text" class="questionInput" value="' + $(this).val() + '" id="textBox">');
});

<input name="input1" class="questionInput" id="textBox" type="text">

Функция фокусировки работает, но функция размытия не работает.Я уже пробовал более простую функцию размытия, например, оповещение.

Ответы [ 2 ]

2 голосов
/ 03 декабря 2011

Вам нужно использовать live, потому что вы заменяете текущий элемент, с которым не связано размытие.

Так попробуйте это:

$("#textBox").live("focus",function() {

    $("#textBox").replaceWith('<textarea id="textBox">' + $(this).val() +'</textarea>');

});

$("#textBox").live("blur", function() {

    $("#textBox").replaceWith('<input type="text" class="questionInput" value="' + $(this).val() + '" id="textBox">');

});

<input name="input1" class="questionInput" id="textBox" type="text">
0 голосов
/ 03 декабря 2011

Вы также можете добавить «размытие» при замене вашего элемента новым:

$("#textBox").focus(function() {
  $("#textBox").replaceWith('<textarea id="textBox">' + $(this).val() +'</textarea>');
  $("#textBox").blur(function() {
     // Do something on blur
});

Как только вы замените элемент, вы также удалите слушателя. Чтобы преодолеть это, вы присоединяете слушателя к родительскому элементу вашего элемента формы и просто изменяете содержимое этого родителя (слушатель находится на родительском элементе, поэтому он останется даже при изменении того, что находится внутри).

...