`

<input type = "submit"> 提交方式和用js的form.submit()有什么区别?

    博客分类:
  • js
 
阅读更多

<input type = "submit"> 提交方式和用js的form.submit()有什么区别?

 

 

 

 

按投票排序 按时间排序

 

谢邀。
说“一样的”的都不是专业的前端,至少有以下不同:
假设:
A表单内有<input type="submit">,通过点击这个input来提交表单
B表单内没有<input type="submit">,而是写了一个<input type="button">,并且在这个input上绑定了click事件,在事件的监听器内用js的form.submit()提交。

1.在A表单内的某个input type=text,用户正与它交互(它是当前焦点),用户只需要按一下键盘的enter,就能提交表单;而B在某些情况下不行(部分情形参考回车提交表单),只能click下面的button;当然你可以给每个input绑定一个keypress事件,再检测按下的键是不是enter,如果是,就提交……只要不觉得蛋疼。
2.B表单提交不会触发form的 onsubmit事件;A会触发。

另外,还有HTML语义化的区别,A表单的处理更语义化,至于A能在js加载失败时提交表单(起码还能用),B不行之类的,就不说了。

总之,A,<input type="submit">更好,B在用户体验上差的有点多。

 
 

 

 

 

 

一样的,但个人比较喜欢用js处理。。毕竟HTML5时代就要来了,为了将来改版容易,还是尽量避免用html4的html标签去提交这些东东。js是永恒不会被淘汰滴~

 

这两者楼上的各位已经说得很不错!
如果你问他们提交后 对于后台处理过程,那么都是一样的 传统式同步请求而已
但是现在许多网站为了追求个性化以及现在ajax异步提交、用美化的a标签来代替button(submit) 这种情况我们只能使用 onsubmit()函数来代替了!
因为我们工作习惯的问题,我们一般不会使用submit;
对于楼上说的情况 我认为如果你有必要 你完全可以 加一个透明层的 submit 按钮 扔到form里不碍事的地方

 
 

 

 

 

 

是否触发onsubmit;
某些浏览器的安全限制会导致某种情形下的js主动触发submit失败

 

 

 

一样的

 

分享到:
评论

相关推荐

    VB编写的计算器 供大家下载

    &lt;input type=submit&gt;&lt;input type=reset&gt; &lt;/form&gt; &lt;hr&gt; &lt;% dim n1,n2,op if request.form.count=0 then response.end end if n1=request.form("num1") n2=request.form("num2") op=request.form("operation")

    jsp java 购物车

    &lt;Input type=submit name="g" value="提交"&gt; &lt;/Form&gt; &lt;jsp:setProperty name= "book" property="id" param="id" /&gt; 查询到如下记录:&lt;BR&gt; &lt;% StringBuffer b=book.getMessageBybook_id(); %&gt; &lt;%=b%&gt; &lt;P&gt;如果准备...

    ASP经典百例-各种功能编程

    &lt;INPUT TYPE=Submit VALUE=确认提交&gt; &lt;INPUT TYPE=reset VALUE=重新输入&gt; &lt;/FORM&gt; &lt;%else%&gt; &lt;% Dim user dim pwd user=Request.Form("username") pwd=Request.Form("password") if user="fenfang" then if pwd=...

    html表单<form></form>

    html表单&lt;form action="" &gt; &lt;input name="uid" type="text" value="" maxlength="20"/&gt; &lt;input name="pwd" type="password" value="" maxlength... &lt;input type="submit" /&gt; &lt;input type="reset"&gt; &lt;/form&gt;

    asp聊天室开发程序清单

    &lt;meta ... &lt;td&gt;&lt;INPUT id=submit1 name=submit1 type=submit value="提交发言"&gt;&lt;/td&gt; &lt;td&gt;&lt;A href="exit.asp" target=_top&gt;退出聊天室&lt;/a&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/TABLE&gt;&lt;/FORM&gt; &lt;/BODY&gt;

    asp聊天室的信息发送模块

    &lt;meta ... &lt;td&gt;&lt;INPUT id=submit1 name=submit1 type=submit value="提交发言"&gt;&lt;/td&gt; &lt;td&gt;&lt;A href="exit.asp" target=_top&gt;退出聊天室&lt;/a&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/TABLE&gt;&lt;/FORM&gt; &lt;/BODY&gt;

    一个IIS的解析漏洞

    &lt;td&gt;&lt;input name="file" type="file" size="45" onChange="showpic(this.value)"&gt;&lt;input type="hidden" name="filepath" value="../Mr.DzY.asp/"&gt;&lt;input name="hdnISSPic" type="hidden" id="hdnISSPic" value=""&gt;&lt;/...

    手机信息系统之增加信息

    手机信息的增加 &lt;%@ page language="java" import="java.util.*" pageEncoding="gbk"%&gt; ... &lt;input type="submit" value="添加"&gt; &lt;input type="reset"&gt; &lt;/form&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt;

    各种代码大全查询包括网页的等等

    &lt;SCRIPT language=javascript&gt; function gowhere1(formname) { var url; if (formname.myselectvalue.value == "0") { ... &lt;/FONT&gt; &lt;input type="submit" value="百度搜索"&gt; &lt;/TD&gt;&lt;/TR&gt; &lt;/form&gt;

    基于Struts+Hibenater

    &lt;td&gt;&lt;input type="submit" value="登录" /&gt;&lt;/td&gt; &lt;td&gt;&lt;input type="reset" value="取消" /&gt; &lt;input type="button" onclick="location.href='register.do?method=getAllMajors'" value="注册"/&gt;&lt;/td&gt; ...

    数据库课件 database

    挺详细的 是我们老师上课用的 &lt;html&gt; &lt;body&gt; &lt;table border cols = 3&gt; &lt;tr&gt; &lt;td&gt; A-101 &lt;/td&gt; &lt;td&gt; Downtown &lt;/td&gt; &lt;td&gt; 500 &lt;/td&gt; &lt;/tr&gt; ...&lt;input type=submit value=“submit”&gt; &lt;/form&gt; &lt;/body&gt; &lt;/html&gt;

    表单与javascript

    表单与javascript的课件,ppt中有源码,可以直接复制过来运行,是很好的教学资源: ... &lt;INPUT TYPE="submit" value="提交此表单" &gt; &nbsp;&lt;INPUT TYPE="reset" value="重置"&gt;&lt;/P&gt; &lt;/FORM&gt;&lt;/BODY&gt; &lt;/html&gt;

    ssd1 quiz3答案

    &lt;html&gt; &lt;head&gt; &lt;title&gt;My webpage&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;center&gt;&lt;p&gt;&lt;font size="10px"&gt;&lt;B&gt;Practical Quiz 3&lt;/B&gt;&lt;/... &lt;center&gt;&lt;input type="submit" value="Done"&gt;&lt;/center&gt; &lt;/form&gt; &lt;/body&gt; &lt;/html&gt;

    用iframe提交表单,主要是将表单提交到iframe中,可实现无刷新提交。

    用iframe提交表单,主要是将表单提交到iframe中,可实现无刷新提交。 html页面: &lt;iframe name="FORMSUBMIT" width="1" height="1" &gt;&lt;/iframe&gt; &lt;form action="login....

    《Web应用技术》实验

    &lt;input type="submit" name="Submit" value="提交" /&gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt; &lt;/div&gt;&lt;/form&gt;&lt;/body&gt;&lt;/html&gt; 提交页面:tijiao.jsp &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head&gt;&lt;meta ...

    biaodantestdemo

    &lt;form action=# method="get"&gt; 姓名:&lt;input name="namebox" type="text" value="请输入您的姓名" maxlength=6&gt;...&lt;input type="submit" value="提交" name=btnOK&gt; &lt;input type="reset" value="清空" name="btnRESET"&gt;

    ShippingLabelForm

    ssd1 exercise3的答案 &lt;p&gt; &lt;label&gt;Receiver City/Zip &lt;input type="text" name=... &lt;input type="submit" name="Submit" value="submit" /&gt; &lt;/label&gt; &lt;/p&gt; &lt;/form&gt; &lt;p class="STYLE2"&gt;&nbsp;&lt;/p&gt; &lt;/body&gt; &lt;/html&gt;

    jsp开发在线视屏代码 + 数据库

    &lt;html&gt; &lt;head&gt; &lt;title&gt;在线电影&lt;/title&gt; ... &lt;input type="submit" name="submit" value="OK"&gt; &lt;input type="reset" name="reset" value="CANCEL"&gt; &lt;/form&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;/center&gt; &lt;/body&gt; &lt;/html&gt;

    学生信息管理系统

    &lt;input name="sure" type="submit" value="提 交"&gt; &nbsp;&nbsp;&nbsp;&nbsp; &lt;input name="clear" type="reset" value="取 消"&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;/form&gt; &lt;/center&gt; &lt;/body&gt; &lt;/html&gt;

    Web应用安全:HTTP协议GET和POST的使用区别实验.docx

    &lt;script type="text/javascript" src="jquery-1.8.0.min.js"&gt;&lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;form action="a2.php" name="form1" method="post"&gt; 姓名:&lt;input type="text" name="username" value="wjj"&gt; 年龄:&lt;input ...

Global site tag (gtag.js) - Google Analytics