jquery输入/按键不工作

我想创建一个简单的搜索框，允许您根据您在输入字段中输入的关键字进行搜索。如果按下“提交”按钮，此工作正常。jquery输入/按键不工作

我也想能够按回车键或Return键开始搜索。我试过使用.on函数，它似乎只能用于点击，但在输入或按键时没有成功。任何有识之士将不胜感激！

$(document).ready(function() { 

    //$("#gallery").empty();       
    $("#submit").on("click keypress",function (e) { 
       console.log($(this).text()); 
       console.log("e.which " +e.which); 
       console.log("e.type " +e.type); 

      if (e.which === 13 || e.type === 'click') {  
       if($("#term").val() !=""){ 
       //$("#gallery").empty();  
       /**********************/ 
       updatestatus(); 
       ajaxProcess(); 
       /**************************/  
       }else { 
        //$("#gallery").text("Please enter a keyword to search").fadeOut(2500); 
        alert("Please enter a keyword to search"); 
       } 
      } 
    }); 

    $("#clear").click(function(){ 
      $("#gallery").empty();     
    }); 

});

HTML

<form> 
<input type="text" value="" id="term" /> 
<input id="submit" type="button" value="Go"> 
<input type="reset" id="clear" value="Clear" /> 
</form>

来源

2015-04-05 user244394

那么你击中'＃submit'按钮进入，或者在'＃term'输入？您应该可以将一个事件绑定到每个元素。 – adeneo 2015-04-05 16:59:58

甚至更好，将事件附加到submit'事件的表单，并且它会自动工作 – adeneo 2015-04-05 17:00:26

@ user244394我已经展示了将表单提交以及绑定按键事件同时输入到文本框的示例。检查我的回答 – mohamedrias 2015-04-05 17:15:24

你只绑定事件处理程序#submit元素。但是按键事件不是在那个元素上提出的。

相反，你必须绑定到文档：

$(document).keypress(function(e) { 
    switch (e.keyCode) { 
     case 13: // RETURN 
      ... 
    } 
}

在处理函数，那么你可以检查哪个键被按下，并采取行动。

来源

2015-04-05 17:00:38 arkascha

绑定一个onsubmit事件处理程序的形式。因此，当您在输入文本中点击enter键时，表单提交将触发将执行您的ajax调用。

$("#submit").on("click keypress",function (e) { 
 
     
 
      if($("#term").val() !=""){ 
 
      /* 
 
      updatestatus(); 
 
      ajaxProcess(); 
 
      */ 
 
      }else { 
 
       alert("Please enter a keyword to search"); 
 
      } 
 
}); 
 

 
$("#clear").click(function(){ 
 
    $("#gallery").empty();     
 
}); 
 

 
    $("form").submit(function(e){ 
 
       $("#submit").trigger('click'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<form> 
 
<input type="text" value="" id="term" /> 
 
<input id="submit" type="button" value="Go"> 
 
<input type="reset" id="clear" value="Clear" /> 
 
</form>

或绑定keypress事件到input文本框和检查event.which==13检查，如果其进入关键并做处理。

$("#submit").on("click keypress",function (e) { 
 
     
 
      if($("#term").val() !=""){ 
 
      /* 
 
      updatestatus(); 
 
      ajaxProcess(); 
 
      */ 
 
      }else { 
 
       alert("Please enter a keyword to search"); 
 
      } 
 
}); 
 

 
$("#clear").click(function(){ 
 
     $("#gallery").empty();     
 
}); 
 

 
    $("input#term").on("keypress", function(e){ 
 
    if (e.which === 13) { 
 
     $("#submit").trigger('click'); 
 
    } 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<form> 
 
<input type="text" value="" id="term" /> 
 
<input id="submit" type="button" value="Go"> 
 
<input type="reset" id="clear" value="Clear" /> 
 
</form>

来源

2015-04-05 17:03:35 mohamedrias

绑定事件到表单输入字段它的自我：

$(document).ready(function() { 

    $("#submit").on("click",function() { 
     // After submit stuff: 
     updatestatus(); 
     ajaxProcess(); 
    }); 

    $("form input").keypress(function(e){ 
     if (e.which === 13) { 
      $("#submit").trigger('click'); 
     } 
    }); 

});

来源

2015-04-05 17:04:22

您的代码idoes火两个事件“点击”和“按键”，但这里的渔获您是否已经使用提交按钮绑定了“按键”事件，该按钮只会触发输入按钮而不是字符或数字键，因此您需要将按键绑定到输入类型或文档本身来执行操作，而不是按钮类型

另外KeyPress事件不是由非字符键引发的;但是，非字符键会引发KeyDown和KeyUp事件。

快乐编码

来源

2015-04-05 17:34:48

jquery输入/按键不工作

回答

相关问题