山海科技发展网

08月09日科技常识:form表单提交数据的几种方式

导读 摘要 今天小编跟大家讲解下有关form表单提交数据的几种方式 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关form表单提交数...
摘要 今天小编跟大家讲解下有关form表单提交数据的几种方式 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关form表单提交数据的几

今天小编跟大家讲解下有关form表单提交数据的几种方式 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关form表单提交数据的几种方式 的相关资料,希望小伙伴们看了有所帮助。

一、submit提交

一般表单提交通过type=submit实现 input type="submit",浏览器显示为button按钮 通过点击这个按钮提交表单数据跳转到/url.do

<form action='http://www.123.com/postValue' method='post'> <input type='text' name='username'/> <input type='password' name='password'/> <input type='submit' value='登录'/> </form>

当点击登录时 提交的数据是:

username=username&password=password

这种默认的提交方式 一般会进行页面的跳转(不成功时跳转到当前页面) 而有时我们是对弹出框进行数据提交 希望提交成功则关闭弹出框并刷选父页面 失败则提示失败原因 且弹出框不关闭。此时可采用ajax进行数据提交。

二、ajax提交form表单$('#documentForm').submitForm({ url:"/Document/SubmitDocumentCreate", dataType:"text", callback:function(data){ endFileUpload(); data=eval("("+data+")"); alert(data.Content); if(data.Result > 0){ location.href = data.Redirect; } }, before:function(){ startFileUpload(); var errMsg =""; }}).submit();

此时可以在callback函数中对请求结果进行判断 然后执行不同的动作(页面跳转或数据刷新、提醒错误)

三、form表单提交附件

需要设定form的enctype=“multipart/form-data” 并且添加<input type='file'>而且附件只能通过submit方法进行提交

通过type=submit提交

一般表单提交通过type=submit实现 input type="submit",浏览器显示为button按钮 通过点击这个按钮提交表单数据跳转到/url.do

<input type="text" name="name"/> <input type="submit" value="提交"></form> js提交form表单

js事件触发表单提交 通过button、链接等触发事件 js调用submit()方法提交表单数据 jquery通过submit()方法

<form id="form" action="/url.do" method="post"> <input type="text" name="name"/></form>js: document.getElementById("form").submit();jquery: $("#form").submit();

来源:爱蒂网