enter/keypress上的Jquery不起作用
enter/keypress上的Jquery不起作用
提问于 2015-04-06 00:54:54
我正在尝试创建一个简单的搜索框，允许您根据您在输入字段中输入的关键字进行搜索。如果您按下Submit按钮，则可以正常工作。
我还希望能够按Enter或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>回答 4
Stack Overflow用户
发布于 2015-04-06 01:03:35
将onsubmit事件处理程序绑定到窗体。因此，当您单击输入文本中的enter键时，表单submit将触发执行您的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是否按enter键并执行此过程。
$("#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>
Stack Overflow用户
发布于 2015-04-06 01:00:38
您只需将事件处理程序绑定到#submit元素。但是在该元素上不会引发按键事件。
相反，您必须绑定到文档：
$(document).keypress(function(e) {
switch (e.keyCode) {
case 13: // RETURN
...
}
}在处理函数中，您可以检查哪个键被按下并对其执行操作。
Stack Overflow用户
发布于 2015-04-06 01:04:23
将事件绑定到表单输入字段本身：
$(document).ready(function() {
$("#submit").on("click",function () {
// After submit stuff:
updatestatus();
ajaxProcess();
});
$("form input").keypress(function(e){
if (e.which === 13) {
$("#submit").trigger('click');
}
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/29459741
复制相关文章
相似问题
腾讯云开发者
