1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > input type=submit 和button的区别及表单提交

input type=submit 和button的区别及表单提交

时间:2020-02-09 14:36:10

相关推荐

input type=submit 和button的区别及表单提交

在一个页面上画一个按钮,有四种办法:

1 <input type="button" />这就是一个按钮。如果你不写javascript 的话,按下去什么也不会发生。2 <input type="submit" />这样的按钮用户点击之后会自动提交 form,除非你写了javascript 阻止它。3 <button>这个按钮放在 form 中也会点击自动提交,比前两个的优点是按钮的内容不光可以有文字,还可以有图片等多媒体内容。(当然,前两个用图片背景也可以做到)。它的缺点是不同的浏览器得到的 value 值不同;可能还有其他的浏览器兼容问题(葛亮)。4其他标签,例如 a, img, span, div,然后用图片把它伪装成一个按钮。

提交表单的方式:

1 <input type="button" />这就是一个按钮。通过编写javascript,添加 onclick提交form。2 <input type="submit" />这样的按钮用户点击之后会自动提交 form,除非你写了javascript 阻止它。3 <button>这个按钮放在form中也会点击自动提交4 <input type="image">此标签放置在<form>标签内就具有提交功能需要强调的一点是,其实<input type="submit" />不是一个画面元素,而是一个表单(Form)元素,和文本输入是一样的,都属于“数据”的一部分(特征是,有value属性,而且该属性的值,会被传送到server端,可以拿来用),而不是样式的一部分。这种表现和数据混淆的设计,是早期web标准还比较简陋的时代的遗产。

从画面表现上看,通过CSS可以把两者描绘得完全一样。

从画面动作上看,通过JS可以强制两者动作也一致(都提交或者都不提交)。

但是只有表单数据这个特性,是无法混淆的。<button>无法把自己当成Form的数据。

所以,如果只是个单纯的按钮,触发一些画面动作,请使用<button>;反之,会把画面的数据提交给Server的,一般用<input type="submit" />,当然<button>+JS也完全可以取代。

作者:zhaosj

链接:/question/20839977/answer/21842933

来源:知乎

著作权归作者所有,转载请联系作者获得授权。

作者:王洪雷

链接:/question/20839977/answer/16354924

来源:知乎

著作权归作者所有,转载请联系作者获得授权。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。