键入速度太快时不会触发按键事件的功能

Question

 var oldValue;

$(document).on('keydown','.main', function (e) {
    oldValue = $(this).val(); 
});
var newValue;
$(document).on('keyup', '.main',function (e) {
    newValue = $(this).val();
     foo(oldValue,newValue);
});

function foo(orig){
$('#table2').find('tbody tr').each(function (i) {
        var $td2 = $(this).find('td input:text');
        if (orig == $td2.val()) {
            $td2.val(newValue);
        }
    });
}

这就是发生的情况，如果我在表1上缓慢地更改“ Apple”，而“ Apple”输入字段却更改了，但是如果输入速度太快，则我的代码将无法正常工作。

Answer 1

如果您在原始输入字段和对应的输入字段之间添加某种关系，该怎么办：

 <input type='text' class= 'main' value="Apple" rel="sec_apple"/>

和

<input type='text' value="Apple"  class="sec_apple"/>

用于第二个输入。

然后，您的JavaScript可能如下所示：

$(document).on('keyup', '.main',function (e) {
    foo($(this));
});

function foo(orig){
    rel = orig.attr('rel');    
    var sec = $('.' + rel);
    sec.val(orig.val());    
}

演示版

Answer 2

使用JavaScript而不是jQuery。 jQuery有很多开销，并且可能太慢。

这里可能不是这样。 您确实需要更好地解释这个问题。

我使用我的代码进行了测试，不能错过任何按键。

我的测试例程会更改每个onkeyup上的背景颜色。

我只使用了Apple和Banana右侧表1中的两个文本输入。

由于我不了解您在做什么，因此我的测试例程会更改每个onkeyup上的背景颜色。 如果我在两个文本字段中都尽可能快地键入123456789，则它们都以正确的颜色结尾。

您可能会注意到，我在全局范围内声明了输入，并使用数组代替了if。 jQuery无法有效完成的事情。

我放弃jQuery的原因是我发现jQuery在iPad上速度太慢。

在以下位置进行了以下测试：此测试位置

<!DOCTYPE HTML>
<html lang="en"><head><title>keys</title></head><body>
Table1
<form id='form1'>
<table id='table1'><tbody>
<tr><td><input type='text' class= 'main' value="Apple"/></td>
<td><input id="t1" type='text' class= 'main' value="" onkeyup="key(1)"/></td>
</tr><tr>
<td><input type='text' class= 'main' value="Banana" /></td><td><input id="t2" type='text' value="" onkeyup="key(2)"/></td>
</tr></tbody></table>
Table2
<table id='table2'><tbody>
<tr><td><input type='text' value="Apple" /></td></tr>
<tr><td><input type='text' value="Banana" /></td></tr>
<tr><td><input type='text' value="Banana" /></td></tr>
</tbody></table>
<br />
</form>

<script type="text/javascript">
//<![CDATA[
var color = new Array;
color[0] = '#f00';
color[1] = '#f0f';
color[2] = '#ff0';
color[3] = '#0ff';
var nc=[0,0,0];
var next = [1,2,3,0];
var txt=new Array;
txt[1] = document.getElementById('t1');
txt[2] = document.getElementById('t2');
function key(id){
nc[id] = next[nc[id]];
txt[id].style.background=color[nc[id]];
}
//]]></script></body></html>

键入速度太快时不会触发按键事件的功能

问题描述

2 个解决方案

解决方案1
1 2015-01-22 07:58:25

解决方案2
-2 2015-01-22 08:31:44

键入速度太快时不会触发按键事件的功能

问题描述

2 个解决方案

解决方案1 1 2015-01-22 07:58:25

解决方案2 -2 2015-01-22 08:31:44

解决方案1
1 2015-01-22 07:58:25

解决方案2
-2 2015-01-22 08:31:44