#12455 closed bug (cantfix)
Button click occurs when Enter is pressed in text input
Reported by: | belerweb | Owned by: | belerweb |
---|---|---|---|
Priority: | low | Milestone: | None |
Component: | event | Version: | 1.8.0 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
I load a page into a div using '.load()' method. The loaded page have a text input element, no form.
When press 'Enter' key in the text input, the page will be load again.
I have wrote a sample test code as flows:
test.html:
page.html:
page.js:
alert('test.js loaded.');
Steps:
- Open test.html
- Click button 'Load page into page'.
- Press 'Enter' key in the input 'Press 'Enter' key here"'.
Expect:
Nothing happend where press 'Enter' key.
Bug:
The page 'page.html' is loaded again and you can get the alert 'alert('test.js loaded.');',
Testcase:
IE7 standard: OK.
IE8 & IE9 standard: Failed.
Firefox: OK.
jQuery version: 1.7 - 1.8
Change History (9)
comment:1 Changed 10 years ago by
comment:2 Changed 10 years ago by
page.html
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <script type="text/javascript" src="page.js"></script> </head> <body> <input type="text" value="Press 'Enter' key here" style="width: 200px;" /> </body> </html>
comment:3 Changed 10 years ago by
Component: | unfiled → ajax |
---|---|
Owner: | set to belerweb |
Priority: | undecided → low |
Status: | new → pending |
Thanks for taking the time to contribute to the jQuery project!
Do you have this test hosted somewhere?
comment:4 Changed 10 years ago by
Status: | pending → new |
---|
Sorry for there is no hosted test. I am trying to use jsFiddle. But the 'load' method can not be executed on jsFiddle.
I have submit all the code (test.html, page.html and page.js) in comments. You can put the three sample file in any host to test.
comment:5 follow-up: 6 Changed 10 years ago by
Status: | new → pending |
---|
Thanks for contributing! You can not include an entire page, doctype and all, into the contents of an element on a page and expect predictable results. Please provide an example that only loads the the scripts and the contents of the body and see what happens. If you're still having issues, please seek help on the forum, stackoverflow, or IRC first before coming back to report the bug. Thanks!
comment:6 Changed 10 years ago by
Status: | pending → new |
---|
Replying to mikesherov:
Thanks for contributing! You can not include an entire page, doctype and all, into the contents of an element on a page and expect predictable results. Please provide an example that only loads the the scripts and the contents of the body and see what happens. If you're still having issues, please seek help on the forum, stackoverflow, or IRC first before coming back to report the bug. Thanks!
'Only loads the the scripts and the contents of the body' is same as 'include an entire page' .
And I create a sample demo hosted at http://jsfiddle.net/NSzRd/.
comment:7 Changed 10 years ago by
Resolution: | → cantfix |
---|---|
Status: | new → closed |
The fiddle is still incorrect, here is a cleaned-up version: http://jsfiddle.net/dmethvin/NSzRd/2/
It has nothing to do with $.ajax, this is a simpler test case: http://jsfiddle.net/dmethvin/NSzRd/3/
The default is type=submit
for a button.
http://www.w3.org/TR/1999/REC-html401-19991224/interact/forms.html#edef-BUTTON
IE triggers a submit button if there is only one submit button and one text input on the page and you press Enter in that input. If you set the button to type=button
the problem goes away:
http://jsfiddle.net/dmethvin/NSzRd/5/
Note that older versions of IE default to type=button
and newer versions may as well if they're in various compatibility views, so specifying it explicitly is a good idea if you want consistent behavior.
http://msdn.microsoft.com/en-us/library/ie/ms535211(v=vs.85).aspx
Because of the complex interaction IE has here, this is not something I think we can reliably normalize across browsers. Fortunately, the solution is really easy, just add type=button
to your buttons unless you really want them to be submit buttons.
comment:8 Changed 10 years ago by
Component: | ajax → event |
---|---|
Summary: | Trigger second execution when press 'Enter' in a page loaded by '.load' method. → Button click occurs when Enter is pressed in text input |
comment:9 Changed 10 years ago by
FWIW, I think browser vendors are still arguing over what the correct behavior is for cases like this.
test.html