JQuery onblur не работает

$('#lPass').focus(function() {  
        if (this.value == this.defaultValue) this.value = '';
        $(this).after('<input type="password" id="lPass" size="10" value="'+this.value+'"/>').remove();
}).blur(function() {
    alert(1);
});

<input id="lPass" type="text" size="10" value="Password"/>

onblur не работает.
Любые идеи?

Ответ 1

Используйте live вместо фокуса и размытия

.live() устарел. Вместо этого используйте . On() и . Off().

потому что вы добавляете ввод во время выполнения, поэтому он добавляет к странице без событий, live:

Прикрепите обработчик к событию для всех элементы, соответствующие текущим селектор, теперь или в будущем.

Пример:

$('#lPass').on('focus', function() {
    if (this.value == this.defaultValue) this.value = '';
    $(this).after('<input type="password" id="lPass" size="10" value="' + this.value + '"/>').remove();
});


$('#lPass').on('blur', function() {
    alert(1);
});

Ответ 2

Это для вашего точного кода:

$('#lPass').live('focus', function() {  
    if (this.value == this.defaultValue) this.value = '';
    $(this).after('<input type="password" id="lPass" size="10" value="'+this.value+'"/>').remove();
}).live('blur', function() {
    alert(1);
});

Ответ 3

Первая проблема, которую я вижу, это то, что ваш селектор является идентификатором #lPass, но внутри этого селектора вы пытаетесь вставить новый тег с тем же идентификатором. Идентификатор должен быть уникальным на странице. THEN вы пытаетесь удалить с помощью .remove() - кажется, не имеет для меня никакого смысла.

Просто используйте .remove() или используйте новый идентификатор...

ИЛИ уточните, что вы хотите сделать.

Что касается .blur, просто используйте размытие, но идентификатор должен быть исправлен или использовать .live(), поскольку другие предлагают, если вы хотите размыть добавленное новое поле.