Question

在我的页面中有两个按钮。对于输入密钥功能，我编写了以下jQuery代码。

$(function () {    
   $("#first-button-id").keyup(function (e) {
      if (e.keyCode == '13') {
         e.preventDefault();                  
      }
   }).focus();


   $("#second-button-id").keyup(function (e) {
      if (e.keyCode == '13') {              
         e.preventDefault();                 
      }
   }).focus();
});

但总是当点击输入键时，第一个就是开火了。请告诉我如何处理多个按钮输入密钥功能。

Answer 1

尝试这样的事情 HTML：

<label>TextBox : </label>
<input id="textbox" type="text" size="50" />
<label>TextBox 2: </label>
<input id="textbox2" type="text" size="50" />

<强> JQuery的

$('#textbox , #textbox2').keyup(function(event){

    var keycode = (event.keyCode ? event.keyCode : event.which);
    if(keycode == '13'){
        alert('You pressed a "enter" key in textbox');  
    }
    event.preventDefault();
}).focus();

DEMO

有些浏览器更喜欢键码和其他用途...我建议你同时使用它们。

Answer 2

您无需同时关注两个按钮。尝试做这样的事情：

$("#button1").keypress(function(event){  
    if ( event.which == 13 ){     
       //Do something}

$("#button2").keypress(function(event){
    if( event.which == 13 ){
        //Do something else}

我认为问题在于你的event.preventDefault（）函数，它会在执行函数时停止事件的传播。在你的情况下，你的第一个函数可能在第二个函数之前完成，因此第二个函数在中间被中止。

Answer 3

第一个提交按钮始终触发的原因是因为这是您未使用代码实际更改过的网页的默认行为。

试试这个：

$(function () {    
   $("#first-button-id, #second-button-id").keyup(function (e) {
      e.preventDefault();
      e.stopImmediatePropagation();
      if (e.keyCode == '13') {
         $(this).trigger("click");                 
      }
   });
});

你似乎在问什么让我觉得很奇怪。如果焦点在第二个按钮上并且按下了输入，您似乎想要“点击”第二个按钮。标签直到焦点在正确的按钮上才是真正可行的唯一实用方法。

Answer 4

$("#first-button-id , #second-button-id ").keyup(function(event){ 
if ( event.which == 13 ) {
     alert("you pressed enter.");
     event.preventDefault(); 
}
}

Answer 5

尝试一下。

$('#first-button-id').on("keydown", function (e) 
{
   if (e.keyCode == 13)
   {
       e.preventDefault();
       $("first-button-id").click();
   }
});

如何处理多个按钮输入关键功能？

5 个答案: