Question

如果我有一个文本框和一个按钮：

<input id='text'/> <button id='btn'>Click me</button>

我的按钮将焦点发送到其点击事件中的某个文本框：

$(document).ready(function(){

  $('#btn').click(function(event){
    console.log('btn ');
    $('#text').focus();
  });

  $('#text').keyup(function(event){
    console.log('key ');
  });

});

...如果你使用回车键触发按钮点击，不知何故，接收焦点的文本元素也会收到回车键。

以下是显示此行为的小提琴：

https://jsfiddle.net/qup6keLd/

使用Tab键将焦点设置到按钮，然后按Enter键。这两个事件都将被触发。使用空格触发按钮的单击将不会执行此操作。为什么会发生这种情况，如何阻止它（除了删除focus（）调用之外？）

Answer 1

使用keypress事件代替keyup事件。

jQuery documentation details两者之间的差异。

请参阅更新的小提琴：

$(document).ready(function(){
    $('#text').keypress(function(event){
    $('#output').append('key ');
  });
  $('#btn').click(function(event){
    $('#text').focus();
    $('#output').append('btn ');
  });
});

Updated Fiddle

为什么我的输入键通过$ .focus（）级联？

1 个答案: