Difference between HTML form tags
As far as I know there are three methods for submitting an HTML form without JS or keyboard:
1.input type = submit 2.button tag 3.input type = image
Is there any other way to create an element that represents the form on click? Is it correct to handle the button tag (type = submit) the same as input type = submit (I mean if we discard the fact button may contain internal html, we can just replace button
with input type="submit"
and the form will submit correctly)? Adds name.x and name.y just the difference when using input type = image?
source to share
- Not that I know these should be the only pure html ways to submit the form other than calling the submit method directly, which is internal Javascript, but this is what the submit button does anyway.
- The button element has an issue in Internet Explorer about which value it conveys, I do not recommend using it.
- Yes, they are almost the same.
- As far as I know, input type = image is exactly the same, except that it sends this extra coordinate parameters, which you can ignore on the server side.
source to share
-
With JavaScript, you can call the submit method of the form. However, this should be avoided as it will not work if the user has JavaScript disabled.
-
No, because the button tag can be assigned a value other than the text displayed on the button, not to mention the tag's capability
<button>
for inline HTML. (For example<button type="submit"><img src="submit.png" alt="Submit"></button>
). -
Yes, the main feature
<input type="image">
is the addition of x and y coordinates.
source to share
You can use JavaScript to simulate. I would take <input type="submit">
and replace it with the element you want to submit the form with, so it's still accessible to non-JavaScript users.
<input type="submit" id="submit-button" value="submit" />
Then in JavaScript (using jQuery in this example):
$('#submit-button').remove().after('<a href="#" id="submit-link">Submit form</a>');
$('#submit-link').click( function(event){
event.preventDefault();
$('#submit-link').closest('form').submit();
});