Html form: Difference between revisions
Jump to navigation
Jump to search
m
Text replacement - "Category:WebDesign" to "Category:Design"
(Created page with "<< Accessibility If the {{kbd | key=submit/reset}} buttons were replace with the {{kbd | key=a/div}} blocks. Before: <pre> <input type='text' name='text1'> <br /> <input...") |
m (Text replacement - "Category:WebDesign" to "Category:Design") |
||
| (4 intermediate revisions by one other user not shown) | |||
| Line 1: | Line 1: | ||
<< [[Accessibility]] | << [[Accessibility]] | ||
If the | == Tab index == | ||
If the <span class="code">submit/reset</span> buttons were replace with the <span class="code">div/a</span> blocks. | |||
Before: | Before: | ||
| Line 21: | Line 22: | ||
* press {{kbd | key=space}} key or {{kbd | key=enter}} key to trigger the reset or submit the form. | * press {{kbd | key=space}} key or {{kbd | key=enter}} key to trigger the reset or submit the form. | ||
* press {{kbd | key=enter}} key to submit the form in any input box. | * press {{kbd | key=enter}} key to submit the form in any input box. | ||
used functions: | |||
* [http://jquery-howto.blogspot.tw/2013/08/jquery-form-reset.html jQuery Howto: jQuery Form Reset] | |||
* [http://api.jquery.com/submit/ .submit() | jQuery API Documentation] | |||
* [http://api.jquery.com/keypress/ .keypress() | jQuery API Documentation] {{exclaim}} <span class="code" style="font-family: source-code-pro, Consolas, monospace !important; word-spacing: 0; padding: 0 3px; background-color: rgba( 0, 0, 0, .1 ); border-radius: 3px;">keypress</span> event works on <span class="code">div</span> element but not <span class="code">a</span> element. | |||
further reading: | further reading: | ||
* [http://www.w3schools.com/tags/att_global_tabindex.asp HTML Global tabindex Attribute] | * [http://www.w3schools.com/tags/att_global_tabindex.asp HTML Global tabindex Attribute] | ||
* [http:// | * [http://htmldog.com/guides/html/advanced/forms/ Accessible Forms | HTML Dog] | ||
== Accesskey == | |||
[http://www.w3schools.com/tags/att_global_accesskey.asp HTML Global accesskey Attribute]. Avoid to conflict with the browser keyboard shortcut e.g. [https://support.google.com/chrome/answer/157179?hl=en Chrome keyboard shortcuts]. | |||
* Press {{kbd | key=Alt}} +{{kbd | key= D}} will switch to Url address on {{Chrome}}. | |||
== Form submit == | |||
Disable the button to prevent multiple form submits e.g. [https://stackoverflow.com/questions/5691054/disable-submit-button-on-form-submit javascript - Disable submit button on form submit - Stack Overflow] | |||
[[Category: | [[Category:Design]] | ||