如何禁用文本输入的正常提交行为,并将其替换为我自己的函数?

时间:2022-08-23 23:02:00

I've tried quite some fixes i found on * and elsewhere but I couldn't get any of them to work properly. They either disable the enter key everywhere or just don't work at all (or they're not properly explained).

我在*和其他网站上找到了很多修复方法,但是我都不能让它们正常工作。它们要么在任何地方禁用enter键,要么就是根本不起作用(或者它们没有得到正确的解释)。

I need the normal submit on enter key behavior to work on all the other elements except this one text input and for it to be replaced with my own function when the text input is selected.

我需要常规的“输入键”提交行为来处理除这一个文本输入之外的所有其他元素,并在选择文本输入时用我自己的函数替换它。

4 个解决方案

#1


9  

How to get whether the Enter is pressed?

如何得知输入是否按下?

$('input.the-one-text-input').keydown(function(e) {
  if(e.keyCode == 13) { // enter key was pressed
    // run own code
    return false; // prevent execution of rest of the script + event propagation / event bubbling + prevent default behaviour
  }
});

Also note this comment on that page:

还请注意该页上的评论:

** If anyone has reached this from Google (like I did), know that "keyup" instead of "keypress" works in Firefox, IE, and Chrome. "keypress" apparently only works in Firefox.

**如果有人从谷歌(像我一样)了解到这一点,要知道“keyup”而不是“keypress”在Firefox、IE和Chrome中都是有效的。“按键”显然只能在Firefox中使用。

Which isn't 100% correct anymore, since it also works works in Chrome. However it wouldn't surprise me if it still doesn't work in IE.

这已经不是100%正确了,因为它也适用于Chrome。但是,如果它在IE中仍然不起作用,我也不会感到惊讶。

#2


3  

http://jsfiddle.net/yzfm9/9/

http://jsfiddle.net/yzfm9/9/

Basically check which input is focused and do custom stuff depending on it

基本上检查哪个输入是集中的,并根据它做定制的东西。

HTML

HTML

<form id="nya">
    username <input type="text" id="input_username" /><br/>
    email <input type="text" id="input_email" /><br/>
    hobby <input type="text" id="input_hobby" /><br/>
    <input type="submit" />
</form>

JS

JS

$('#nya').submit(function() {
    var focusedId = ($("*:focus").attr("id"));
    if(focusedId == 'input_email') {
       // do your custom stuff here

       return false;
    }
});

#3


0  

Returning false when enter is pressed on "onkeydown" will disable the default behaviour. Then you can just call your function on the "onkeyup" event.

在“onkeydown”上按下enter时返回false将禁用默认行为。然后你可以在“onkeyup”事件上调用你的函数。

<input type="text" 
       onkeyup="myFunction()" 
       onkeydown="return event.keyCode != 13;"/>

#4


-1  

Just had a play with jQuery's .keypress() method and it looks like it does the job.

只需使用jQuery的.keypress()方法,它看起来就能完成任务。

HTML

HTML

<form method="post" action="">
    <input type="text" name="submit1" id="submit1" />
    <input type="text" name="noSubmit1" id="noSubmit1" />
    <input type="text" name="submit2" id="submit2" />
    <input type="submit" />
</form>​

JQuery

JQuery

​$('#noSubmit1​​​​​​​​​​​​​​​').keypress(function(event) {
    if (event.which == 13 ) {
        event.preventDefault();
    }
});​​

It basically adds a keypress event to the correct input field, then checks for which key was pressed. If it was the enter button (13), it then prevents the default action (form submission) from happening. See it in action here: http://jsfiddle.net/cchana/UrHz7/2/

它基本上是向正确的输入字段添加一个按键事件,然后检查按了哪个键。如果是enter按钮(13),则阻止默认操作(表单提交)发生。在这里可以看到:http://jsfiddle.net/cchana/UrHz7/2/

#1


9  

How to get whether the Enter is pressed?

如何得知输入是否按下?

$('input.the-one-text-input').keydown(function(e) {
  if(e.keyCode == 13) { // enter key was pressed
    // run own code
    return false; // prevent execution of rest of the script + event propagation / event bubbling + prevent default behaviour
  }
});

Also note this comment on that page:

还请注意该页上的评论:

** If anyone has reached this from Google (like I did), know that "keyup" instead of "keypress" works in Firefox, IE, and Chrome. "keypress" apparently only works in Firefox.

**如果有人从谷歌(像我一样)了解到这一点,要知道“keyup”而不是“keypress”在Firefox、IE和Chrome中都是有效的。“按键”显然只能在Firefox中使用。

Which isn't 100% correct anymore, since it also works works in Chrome. However it wouldn't surprise me if it still doesn't work in IE.

这已经不是100%正确了,因为它也适用于Chrome。但是,如果它在IE中仍然不起作用,我也不会感到惊讶。

#2


3  

http://jsfiddle.net/yzfm9/9/

http://jsfiddle.net/yzfm9/9/

Basically check which input is focused and do custom stuff depending on it

基本上检查哪个输入是集中的,并根据它做定制的东西。

HTML

HTML

<form id="nya">
    username <input type="text" id="input_username" /><br/>
    email <input type="text" id="input_email" /><br/>
    hobby <input type="text" id="input_hobby" /><br/>
    <input type="submit" />
</form>

JS

JS

$('#nya').submit(function() {
    var focusedId = ($("*:focus").attr("id"));
    if(focusedId == 'input_email') {
       // do your custom stuff here

       return false;
    }
});

#3


0  

Returning false when enter is pressed on "onkeydown" will disable the default behaviour. Then you can just call your function on the "onkeyup" event.

在“onkeydown”上按下enter时返回false将禁用默认行为。然后你可以在“onkeyup”事件上调用你的函数。

<input type="text" 
       onkeyup="myFunction()" 
       onkeydown="return event.keyCode != 13;"/>

#4


-1  

Just had a play with jQuery's .keypress() method and it looks like it does the job.

只需使用jQuery的.keypress()方法,它看起来就能完成任务。

HTML

HTML

<form method="post" action="">
    <input type="text" name="submit1" id="submit1" />
    <input type="text" name="noSubmit1" id="noSubmit1" />
    <input type="text" name="submit2" id="submit2" />
    <input type="submit" />
</form>​

JQuery

JQuery

​$('#noSubmit1​​​​​​​​​​​​​​​').keypress(function(event) {
    if (event.which == 13 ) {
        event.preventDefault();
    }
});​​

It basically adds a keypress event to the correct input field, then checks for which key was pressed. If it was the enter button (13), it then prevents the default action (form submission) from happening. See it in action here: http://jsfiddle.net/cchana/UrHz7/2/

它基本上是向正确的输入字段添加一个按键事件,然后检查按了哪个键。如果是enter按钮(13),则阻止默认操作(表单提交)发生。在这里可以看到:http://jsfiddle.net/cchana/UrHz7/2/