如何触发input按键的文本框?
在我的HTML页面,我有一个文本框供用户input关键字进行search。 当他们点击searchbutton时,JavaScript函数将生成一个URL并在新窗口中运行。
当用户通过鼠标点击searchbutton时JavaScriptfunction正常工作,但是当用户按下ENTER键时没有响应。
function searching() { var keywordsStr = document.getElementById('keywords').value; var cmd ="http://XXX/advancedsearch_result.asp?language=ENG&+"+ encodeURI(keywordsStr) + "&x=11&y=4"; window.location = cmd; } <form name="form1" method="get"> <input name="keywords" type="text" id="keywords" size="50" > <input type="submit" name="btn_search" id="btn_search" value="Search" onClick="javascript:searching(); return false;" onKeyPress="javascript:searching(); return false;"> <input type="reset" name="btn_reset" id="btn_reset" value="Reset"> </form>
forms的方法
正如scoota269所说的,你应该使用onSubmit
,使得在文本框上按下最多会触发一个表单提交(如果一个表单内)
<form action="#" onsubmit="handle"> <input type="text" name="txt" /> </form> <script> function handle(e){ e.preventDefault(); // Otherwise the form will be submitted alert("FORM WAS SUBMITTED"); } </script>
文本框的方法
如果你想在input字段上有一个事件,那么你需要确保你的handle()
将返回false,否则表单将被提交。
<form action="#"> <input type="text" name="txt" onkeypress="handle(event)" /> </form> <script> function handle(e){ if(e.keyCode === 13){ e.preventDefault(); // Ensure it is only this code that rusn alert("Enter was pressed was presses"); } } </script>
使用onkeypress
..检查按下的键是否input(keyCode = 13)如果是调用searching()
函数。
HTML
<input name="keywords" type="text" id="keywords" size="50" onkeypress="handleKeyPress(event)">
JAVASCRIPT
function handleKeyPress(e){ var key=e.keyCode || e.which; if (key==13){ searching(); } }
更新:修复代码中的错字,可能会导致以前的投诉,它的工作。
你可以使用JavaScript
ctl.attachEvent('onkeydown', function(event) { try { if (event.keyCode == 13) { FieldValueChanged(ctl.id, ctl.value); } false; } catch (e) { }; return true })
尝试这个….
HTML内联
onKeydown="Javascript: if (event.keyCode==13) fnsearch();" or onkeypress="Javascript: if (event.keyCode==13) fnsearch();"
JavaScript的
<script> function fnsearch() { alert('you press enter'); } </script>
通用jQuery的一点点为你..
$('div.search-box input[type=text]').on('keydown', function (e) { if (e.which == 13) { $(this).parent().find('input[type=submit]').trigger('click'); return false; } });
这工作假定文本框和提交button被包裹在同一个div。 在页面上使用多个search框进行处理
在表单标签上使用onsubmit属性,而不是点击提交。
// jquery press check by Abdelhamed Mohamed $(document).ready(function(){ $("textarea").keydown(function(event){ if (event.keyCode == 13) { // do something here alert("You Pres Enter"); } }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <textarea></textarea>
<form action="#"> <input type="text" id="txtBox" name="txt" onkeypress="handle" /> </form> <script> $("#txtBox").keypress(function (e) { if (e.keyCode === 13) { alert("Enter was pressed was presses"); } return false; }); </script>
容易如舔冰淇淋,让我们假设:
您的网页之前:
<body>
你的网页现在:
<body onkeypress=if(event.keyCode==13)alert('hi')>
这是一个简单的例子; 我假设你有一个简单的身体标签你的网页,如果你插入这个onkeypress函数本身工作,这意味着任何时候你按ENTER键警报将popup[使用.keyCode == 13之后的任何东西]]
所以用这个replace你的BODY标签,然后按ENTER进行testing,你会看到它的工作
您需要为onkeypress
操作创build一个处理程序。
HTML
<input name="keywords" type="text" id="keywords" size="50" onkeypress="handleEnter(this, event)" />
JS
function handleEnter(inField, e) { var charCode; //Get key code (support for all browsers) if(e && e.which) { charCode = e.which; } else if(window.event) { e = window.event; charCode = e.keyCode; } if(charCode == 13) { //Call your submit function } }
使用event.key
而不是event.keyCode
!
function onEvent(event) { if (event.key === "Enter") { // Submit form } };
Mozilla文档
支持的浏览器
根据MDN 已弃用
该function已从Web标准中删除。 尽pipe一些浏览器可能仍然支持它,但它正在被丢弃。 避免使用它并尽可能更新现有的代码; 请参阅本页底部的兼容性表格来指导您的决定。 请注意,此function可能随时停止工作。
但是,如果你真的想使用这个,需要一个值,请访问http://keycode.info/