慎用jQuery中的submit()方法-创新互联
今天在做项目的过程中用到了submit()提交表单。
创新互联建站是一家集网站建设,柳林企业网站建设,柳林品牌网站建设,网站定制,柳林网站建设报价,网络营销,网络优化,柳林网站推广为一体的创新建站企业,帮助传统企业提升企业形象加强企业竞争力。可充分满足这一群体相比中小企业更为丰富、高端、多元的互联网需求。同时我们时刻保持专业、时尚、前沿,时刻以成就客户成长自我,坚持不断学习、思考、沉淀、净化自己,让我们为更多的企业打造出实用型网站。折腾许久很是郁闷,经过多方资料查询和亲测后,得出结论:
一定要慎用submit()方法
首先,在form表单中一定不要将input中的name或id命名为submit,否则会导致在submit()的失效,例如以下脚本在所有浏览器(IE/FF/CHROME/SAFARI)中都会失效:
Page Title
jquery的官方文档的additional notes中也提到了这一点
https://api.jquery.com/submit/
Forms and their child elements should not use input names or ids that conflict with properties of a form, such as
submit
,length
, ormethod
. Name conflicts can cause confusing failures. For a complete list of rules and to check your markup for these problems, see DOMLint.
----------------------
其次,我们要注意到通过form.submit()提交的表单,相对于正常提交表单会遗漏一些信息。
测试以下两个脚本:
脚本1
//脚本1 if(!empty($_POST)) print_r($_POST); ?>Page Title
输出结果为:
Array ( [text1] => test [password1] => school [radio1] => test [checkbox1] => test )
脚本2
//脚本2 if(!empty($_POST)) print_r($_POST); ?>Page Title
输出结果为:
Array ( [test1] => test [password1] => school [radio1] => test [checkbox1] => test [submit1] => Edit )
比较结果:
type为"text"、"password"、"radio"、"checkbox"的input在两种方法中都会正常传递
type为"button"、"reset"的input在两种方法中都不会传递
type为"submit"的input在正常的表单提交中会传递,而在submit()中会丢失
解决方法:
在submit()前,添加"submit"的值
2.换用以下方法,亲测可用
form.submit(function(){ submit = true //你的业务逻辑 if(!submit) return false })
---------------
要说明一点:
网上有部分声音说webkit浏览器(例如chrome)不支持submit()方法,根据我亲身测试新版本的chrome/safari是支持的,可能某些远古版本不支持吧。
最后附上测试所用的浏览器版本:
Chrome: 50.0.2661.102 m
Firfox: 48.0a2
IE:11.0.9600
Safari:windows上的5.1.7 及IOS9.3.1上的Safari
另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。
网页题目:慎用jQuery中的submit()方法-创新互联
标题来源:http://hbruida.cn/article/cepgod.html