-2

This can be a real basic question but what is the difference between <input type = "submit"> and <button onclick="">Example</button>?

It can't be done with function method in Javascript to achieve the same thing that the submit type button will? I always used <button></button> but I'd like to learn the difference.

Altay Mazlum
  • 442
  • 5
  • 15
  • Cannot mark it as duplicate but: http://stackoverflow.com/questions/290215/difference-between-input-type-button-and-input-type-submit and http://stackoverflow.com/questions/3543615/difference-between-input-type-submit-and-button-type-submittext-butto are the first two hits alone on this platform. – eX0du5 Jul 30 '15 at 14:07
  • Take a look at [Difference between and ][1] [1]: http://stackoverflow.com/questions/3543615/difference-between-input-type-submit-and-button-type-submittext-butto Thats what you want to know. – Tobias Jul 30 '15 at 14:08
  • Have you performed a search on stackoverflow? See [here](http://stackoverflow.com/questions/7117639/input-type-submit-vs-button-tag-are-they-interchangeable), [here](http://stackoverflow.com/questions/1979363/html-button-v-s-html-submit), [here](http://stackoverflow.com/questions/469059/button-vs-input-type-button-which-to-use)... – Paolo Gibellini Jul 30 '15 at 14:08
  • A quick search of google and stackoverflow will explain it http://www.webdeveloper.com/forum/showthread.php?135004-Difference-between-input-type-quot-button-quot-and-quot-submit-quot – Canvas Jul 30 '15 at 14:10
  • When I entered the question, the auto-complete didn't suggest anything like it so I didn't search but yes now I see, it has been asked plenty times. Thanks for the links! – Altay Mazlum Jul 30 '15 at 14:11

1 Answers1

3

The value of a submit input will be the display label. 

<input type="submit" name="foo" value="bar"> <!-- Displays [bar] -->

The child nodes of a submit button will be the display label. The value can be different and the label can include elements as well as text.

<button type="submit" name="foo" value="bar">
    <img src="arrow.png" alt=""> Baz
</button>
<!-- Displays [→ Baz] -->

There are no differences between them that are JavaScript related. You can't use JavaScript to couple or decouple the display label and submitted value.

Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335