Hitting “enter” from an input (text) field when a

2019-08-13 15:08发布

问题:

I'm trying to figure out something having to do with the behavior descibed by this old question from last year. I've got a form with a single input text field, and a single "submit" button. Unlike the person who asked that question, I want the form to submit when the user hits "enter". Indeed, that's working for me; what's not working however is the quirk that causes a "submit" input in the form to be virtually clicked: Firefox and Chrome include the "submit" input's name in the parameters posted, while IE does not. In other words, I want this quirky submit behavior to post the text input field, and the submit input too.

The funny thing is that my form was doing just that up until some mystery change I introduced recently. (Firefox and Chrome do still work, but IE once worked and now doesn't.) I can probably figure out what I changed to break it, but as @bobince seemed to understand something about this quirk I figured I'd ask to see if there are known (possibly even documented) ways to control it.

Here's my test page: http://gutfullofbeer.net/post.html

It's about as simple a test as I could make up:

<!DOCTYPE html>
<html>
  <body>
    <form name='foo' action='cgi/echoparams.cgi' method='post'>
      <input type='text' name='name' value=''>
      <input type='submit' name='submit_button' value='Submit'>
    </form>
  </body>
</html>

The cgi script just parrots back the posted content.

回答1:

Yeah, sorry, it's not directly fixable. I don't know what your previous ‘working’ case was, but I suspect there might have been an extra input present. (It's only when there's a single text input that the exceptional behaviour occurs.)

With the historical mines around the question of whether a default-submit button is ‘successful’, it's better never to rely on it. Add the hidden input to signify a submission and omit the name on the submit button. Put any submission scripting on form onsubmit rather than the default button.

If you have additional submit buttons for different actions (eg. Edit vs Delete), then make the first button perform the ‘default’ action and set no name, then add name/values that override the default behaviour on the other buttons. These are sure to be ‘successful’ (and will receive a click event) if clicked.



回答2:

I just stumbled upon this strange behaviour. I had one case in which the value of the name attribute and the value from a button were submitted, and a different case, where the name and value attributes of the button Tag where missing in my POST Data.

(I used the <button ...>-tag, but it seems that this doesn't matter.)

After fiddling around quite a while, i finally got the solution, so i registered to let you guys know.

IE7 & IE8 start submitting the name & value of a present button-tag, the just in case of a second <input type="text">-tag. If there is only one <input type="text"> present in the page and you hit enter within this input-field the name & value of the button are missing.

Radiobuttons, checkboxes, hidden inputs... don't matter, you need a second <input type="text"> to fix this.