jquery - jquery：输入替换后焦点/模糊事件不起作用

Question

我有一个具有以下属性的简单输入元素：

<input id="InputPassword" type="password" value="Password" class="initClass"/>

为了为其设置跨浏览器占位符，我使用 testFocusBlur 函数

function testFocusBlur(){
$('input').focus(function () {
    if($(this).attr('type')=='text'){
       var campoPassword=$(this);
       replaceInputType(campoPassword[0], 'password')
    }
}).blur(function () {
    if($(this).attr('type')=='password'){
    var campoPassword=$(this);
    replaceInputType(campoPassword[0], 'text')
    }
});
$('input').blur();

}

其中，在 $(document).ready 事件中：

1. 在输入元素上调用模糊事件；
2. 如果 type=password 调用 replaceInputType javascript函数；
3. replaceInputType 函数创建一个新的 dom 输入元素，为其设置 type=text，获取旧输入元素的属性并将类从 initClass 更改为 newClass；
4. 将新的输入元素附加到同一个 div

以上工作正常但是，一旦设置了新的输入元素，我专注于它，初始 testFocusBlur 功能不再工作

见：http: //jsfiddle.net/4tRzs/2/

注意：我不想在输入中设置内联函数，例如 onfocus="...."

请帮忙，谢谢。

Answer 1

您需要使用onjQuery 中的函数

$(document).on("focus" , "input", function(){
   ...
}

on是旧live功能。文件

你的函数中会有这样的东西：

function testFocusBlur(){
$(document).on("focus", 'input', function () {
    if($(this).attr('type')=='text'){
       var campoPassword=$(this);
       replaceInputType(campoPassword[0], 'password')
    }
})
$(document).on("blur", "input", function () {
    if($(this).attr('type')=='password'){
    var campoPassword=$(this);
    replaceInputType(campoPassword[0], 'text')
    }
});
}