首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

button vs input type ="submit"vs onclick ="document.formname.submit()"

在前端开发中,button 和 input type="submit" 都可以用于创建提交按钮,但它们之间存在一些差异。

  1. button 标签:

button 标签是 HTML5 中引入的一个通用按钮标签,它可以用于创建多种类型的按钮,例如提交按钮、重置按钮、普通按钮等。button 标签可以包含文本和图像,并且可以通过 CSS 进行样式化。在表单中,button 标签可以通过 JavaScript 进行监听,以执行特定的操作,例如提交表单。

  1. input type="submit":

input type="submit" 是一个特殊类型的 input 标签,它用于创建提交按钮。与 button 标签不同,input type="submit" 只能用于提交表单,并且它的文本内容不能被修改。input type="submit" 的样式通常不可定制,因此开发者通常会使用 CSS 对其进行样式化。

  1. onclick 事件:

onclick 事件是一个 JavaScript 事件,用于在用户单击按钮时执行特定操作。在前端开发中,可以将 onclick 事件与 button 标签或 input type="submit" 标签结合使用,以执行特定的操作,例如提交表单或调用 JavaScript 函数。

总结:

button 和 input type="submit" 都可以用于创建提交按钮,但 button 标签更加灵活,可以包含文本和图像,并且可以通过 CSS 进行样式化。在表单中,button 标签可以通过 JavaScript 进行监听,以执行特定的操作。而 input type="submit" 只能用于提交表单,并且它的文本内容不能被修改。在前端开发中,可以使用 onclick 事件与 button 标签或 input type="submit" 标签结合使用,以执行特定的操作。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

  • javascript当中表单提交(空格提交的问题)

    4.表单提交(空格提交的问题) 例 4.1(form.submitIEFF.html) <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <script language=javascript> function check() { var form = document.getElementById("regForm"); if (form.user.value == "") { alert("用户名不能为空!"); } else { form.submit(); } } </script> <form method=post id="regForm" action="jsp1.jsp"> 用户<input type="text" name="user"/>
    <INPUT TYPE="button" onclick="check();" id="regBut" value="提交"/> </form> 以上例子很好,但有个问题,当光标放在文本框里时,即使空格,回车也会提交。不信你试试,浏览器(IE和火狐)都这样。下面给出解决办法。 例 4.1_a <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <script language=javascript> function check() { var form = document.getElementById("regForm"); if (form.user.value == "") { alert("用户名不能为空!"); } else { form.submit(); } } </script> <form method=post id="regForm" action="jsp1.jsp"> 用户<input type="text" name="user" onkeydown="if(event.keyCode==13) return false;"/>
    <INPUT TYPE="button" onclick="check();" id="regBut" value="提交"/> </form> 或者用下面的例子,里面用了onSubmit,只要提交,它就会被执行。

    03
    领券