用jQuery实时替换输入

我遇到了这个脚本的问题，我想用字段中的Hello World来实时替换输入字段中输入的任何字符。用jQuery实时替换输入

<input id="inputID" type="text" value="" maxlength="11"/> 
$('#inputID').keyup(function(e){ 
    var cv=["h","e","l","l","o"," ","w","o","r","l","d",""]; 

    var i=$('#inputID').val(); 

    for (j=0;j<11;j++){ 

    this.value = this.value.replace(i[j],cv[j]); 

} 

});

这个脚本在我写得很慢的时候效果很好，但是当我写得很快的时候，这个脚本效果不错。感谢您的帮助

来源

2013-05-20 Netshad

所以每次按键更换信的11倍？ – tymeJV

尝试这样：

$('#inputID').keyup(function(e){ 
    var cv = 'hello world'; 
    this.value = cv.substr(0, this.value.length); 
});

See the working demo.

来源

2013-05-20 00:57:04 xdazz

正确和紧凑。只有我会改变的是substr子字符串，但那真的很小， –

工作正常，谢谢 – Netshad

-1

香草JavaScript让所有人都很快与大量事件混淆。

jQuery在队列中为您排定动作，以便它们在适当的范围内执行。

$('#inputID').keyup(function(e){ 
    var cv=["h","e","l","l","o"," ","w","o","r","l","d",""]; 

    var i=$('#inputID').val(); 

    for (j=0;j<11;j++){ 

    $(this).val($(this).val().replace(i[j],cv[j])); 

} 
});

小提琴：http://jsfiddle.net/Xedus129/MenpW/

来源

2013-05-20 00:56:39

“The vanilla Javascript this gets all confused with many events quickly。”什么？你认为你的7行解决方案包括用'.val（$（this）.val（）。replace（）...'运行for循环吗？'比我的4行香草草案（更短，但少教，）？如果是这样，怎么样？ –

@BenjaminGruenbaum我从来没有声称它是更清洁或更快，我只是解决了代码有问题。 –

xdazz是如此lution是正确的（他打败了我）

我觉得在展示一个不依赖于jQuery的解决方案可能会有好处，因此不想依赖它的用户也能受益。

document.getElementById('inputID').onkeyup = function() { 
    var cv = "hello world"; // Your 'correct value' 
    //Set the value to a substring of cv at the current length 
    this.value = cv.substring(0, this.value.length); 
};

http://jsfiddle.net/9yfCe/

来源

2013-05-20 01:00:18

这是一样快，我可以与KEYUP保持事件得到它：

var hw = "hello world"; 
$('#inputID').keyup(function(e){ 
    this.value = hw.substring(0, this.value.length); 
});

Demo

编辑：我相当惊讶三个人提出了几乎完全相同的解决方案。真的很酷。

编辑2：我调整了一下，使其替换最初键入的字符，以帮助减少被替换字母的效果。

var hw = "hello world"; 
$('#inputID').keydown(function (e) { 
    if (e.which !== 8) { // allow backspace 
     e.preventDefault(); 
     this.value += ' '; 
    } 
}).keyup(function() { 
    this.value = hw.substring(0, this.value.length); 
});

Second demo

来源

2013-05-20 01:01:03

用jQuery实时替换输入

回答

相关问题