在 IE9 中输入输入字段焦点最近的按钮

Question

我在下面的代码中有一个输入字段和一个按钮。

我已经编写了一些 javascript 代码来捕获键盘输入并在输入键时显示警报。

这在 Firefox 中工作正常，但在 IE9 中，在输入字段中单击回车会导致按钮获得焦点并且不会触发 javascript 中的 keyUp 触发器。

有人有解决方案的建议吗？

jsfiddle： http://jsfiddle.net/c46khq2x/1/

HTML:

<input type="text" class="js-field-click"/>

<button class="js-button-click">Button</button>

javascript ( JQuery ):

 $( document ).ready(function() {


      $(".js-field-click" ).keyup(function(e) {
         var val = $(this).val();
         var code = e.which;

         if(code==13){
            alert("field enter");
         }
      });

     $(".js-button-click").click( function() {
            alert("button click");
     });
 });

Answer 1

您好，代码有问题。有几件事你需要更正。您可以尝试在下面查看...

$( document ).ready(function() {


      $(".js-field-click").on('keydown', function(e) {
         var val = $(this).val();
         var code = e.which;

         if(event.which == 13){
            alert("field enter");return false;
         }
      });

     $(".js-button-click").click( function() {
            alert("button click");
     });
 });

一些注意事项：-
1. 更喜欢将选择器更改为 window
2.使用.on()函数
3.添加一个return false；阻止事件冒泡。

Answer 2

我模拟 Internet Explorer 9 并将您的代码操纵为：

 $( document ).ready(function() {


  $(".inp" ).keyup(function(e) {alert('keyup triggered');
     var val = $(this).val();
     var code = e.which;

     if(code==13){
        alert("field enter");
     }
  });

 $(".but").click( function() {
        alert("button click");
 });
});

和HTML：

 <input type="text" class="inp"/>

 <button class="but">Button</button>

当我输入一个字母时，它会提醒 "keyup triggered"。但是当我点击回车键时。它向按钮发送点击事件 (but) 并提醒 "button click"。但它不会将 keyup 事件发送到 input

Answer 3

我找到了一个解决方案，IE9 select 下一个按钮似乎在表单中，所以通过将文本字段包装在表单中并将按钮留在表单之外，那么 IE9 将不会 select点击按钮，脚本将工作

<form>
    <input type="text" class="js-field-click"/>
</form>    

<button class="js-button-click">Button</button>

在 IE9 中输入输入字段焦点最近的按钮

Enter in input field focus nearest button in IE9

javascript

jquery

internet-explorer-9