inputtypes=“提交”Vsbutton标签是否可以互换?

input type="submit"button标签是可以互换的? 或者如果有任何区别,那么何时使用input type="submit" ,当button

如果没有区别,为什么我们有2个标签用于相同的目的?

http://www.w3.org/TR/html4/interact/forms.html#h-17.5

使用BUTTON元素创build的button就像使用INPUT元素创build的button一样,但它们提供了更丰富的呈现可能性:BUTTON元素可能具有内容。 例如,包含图像的BUTTON元素的function类似于INPUT元素,其types设置为“image”,但BUTTON元素types允许内容。

所以function只有它们可以互换!

(不要忘记你也必须使用type="submit" button 。)

<input type="button">只是一个button,本身不会做任何事情。 <input type="submit"> ,当在一个表单元素内时,会在被点击时提交表单。

另一个有用的“特殊”button是清除表单的<input type="reset">

使用<button>标记代替<input type =“button”..> 。 在bootstrap 3中build议的做法。

http://getbootstrap.com/css/#buttons-tags

“跨浏览器渲染

作为最佳做法,我们强烈build议尽可能使用<button>元素来确保匹配的跨浏览器呈现。

除此之外,还有一个Firefox错误,它阻止我们设置<input> – 基于button的行高,导致它们与Firefox上其他button的高度不匹配。

<input type='submit' />不支持其中的HTML,因为它是一个自我closures的标签。 另一方面, <button>支持HTML,图像等,因为它是一个标签对: <button><img src='myimage.gif' /></button> 。 在CSS样式中, <button>也更加灵活。

<button>的缺点是旧版浏览器不能完全支持。 例如,IE6 / 7不能正确显示。

除非你有特定的原因,否则最好坚持<input type='submit' />

虽然这两个元素在function上提供了相同的结果,但我强烈build议您使用<button>

  • 更加明确和可读。 input表明控件是可编辑的 ,或者可以由用户编辑; button在服务目的方面更加明确
  • 在CSS中更容易风格; 如上所述,FIrefox和IE在某些情况下input[type="submit"]显示不正确
  • 可预测的请求:当POST / GET请求中的值提交给服务器时,IE具有非常强烈的行为
  • 标记友好; 您可以在button内embedded项目,例如图标。
  • HTML5,前瞻性思维; 作为开发者,我们有责任在新规范正式化的时候采用新规范。 目前为止,HTML5已经正式运营了一年多,并且在很多情况下都被certificate可以提升search引擎优化

总之, 我非常反对使用<input type="submit" />

<button><input type="submit"> ,更加语义化,易于风格化和支持HTML内部的HTML。

我意识到这是一个古老的问题,但我在mozilla.org上发现这一点,并认为它适用。

一个button可以有三种types:提交,重置或button。 点击提交button将表单的数据发送到由元素的action属性定义的网页。

点击重置button可立即将所有表单小部件重置为默认值。 从用户体验的angular度来看,这被认为是不好的做法。

点击一个buttonbutton没有任何东西! 这听起来很愚蠢,但用JavaScript构build自定义button非常有用。

https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Forms/My_first_HTML_form#And_a_<button>_to_finish

虽然其他答案很好,回答这个问题有一件事情要考虑,当使用input type="submit"buttoninput type="submit"你不能在input上使用 CSS伪元素,但你可以为一个button!

这是造型时在input上使用button元素的一个原因。

我不知道这是一个错误还是一个特性,但是有一点非常重要(至less在某些情况下),我发现: <input type="submit">在请求中创build键值对, <button type="submit">不。 在Chrome和Safari中testing

所以,当你的表单中有多个提交button,并想知道哪一个被点击 – 不要使用button ,而是使用input type="submit"

如果您正在讨论<input type=button> ,它将不会自动提交表单

如果你正在谈论<button>标签,这是更新的,并不会自动提交在所有的浏览器。

底线,如果您希望表单在所有浏览器中点击提交,请使用<input type="submit">