JS中的form.submit()不能提交表单的错误原因


Posted in Javascript onOctober 08, 2014

直接上代码把:

<div id="register">

     <h4>会员注册</h4>

     <div class="formdiv">

         <form method="post" action="register.php?action=register" name="register" id="registerForm">

             <dl>

                 <dt>请认真填写以下内容</dt>

                 <dd class="hasspan">

                     用户名:<input type="text" name="username">

                 </dd>

                 <dd class="hasspan">

                     密码:<input type="password" name="pwd">

                 </dd>

                 <dd class="hasspan">

                     确认密码:<input type="password" name="pwdagain">

                 </dd>

                 <dd id="tximg">

                     <img src="img/face/m01.gif" alt="选择头像" id="faceimg">

                     <input type="hidden" name="touxiang" value="">

                     <label id="imgsrclabel">m01.gif</label>

                 </dd>

                 <dd style="margin-right:120px;">

                     验证码:<input type="text" name="code">

                     <span>

                         <img src="code.php" alt="code" id="code" name="code">

                         <a href="#code" id="change">换一张</a>

                     </span>

                 </dd>

                 <dd class="btns">

                     <input type="button" name="submit" id="submit" value="注册">

                     <input type="button" name="quit" id="quit" value="退出">

                 </dd>

             </dl>

         </form>

     </div>

 </div>

 

表单数据提交到本页面,下面是js处理

 /*注册表单提交*/

 function formDeal()

 {

     var btnSubmit = document.getElementById('submit');

     var formId = document.getElementById('registerForm');

     btnSubmit.onclick = function()

     {

         //表单的submit()方法不能提交表单

         formId.submit();

     }
 }

 如果表单提交,在本页面有一段提示信息
 if(!empty($_GET['action']) && $_GET['action'] == 'register')

 {

     echo '你提交了数据';

     exit();

 }

结果是测试了许久都没有看到提示信息,以为是代码错了或者方法写错了,仔细核对,在结果官方文档,确认没有出错。

formId.submit()不能提交,就暂时只好把btnSubmit的type改为submit

 this.type="submit"

在网上查了资料,原因归结为两点:

1、表单中不能有name=”submit” 的标签

2、表单中不能缺少《enctype=”multipart/form-data”》

经测试,此两点乃荒谬,并没有解决我的问题(或许是我的问题环境不一样)

后来,以为论坛的坛友建议我把注册按钮的ID改个名字,不用submit。改正之后,表单正常提交,提示信息出现。

最后总结:button的id不要设置为submit,否则可能会引起混淆,导致表单的submit()方法不能提交表单。在命名ID时,名字最好不要和现有的api在名称上重复,避免不必要的烦扰。

Javascript 相关文章推荐
B/S开发中常用javaScript技术与代码
Mar 09 Javascript
用Javascript 和 CSS 实现脚注(Footnote)效果
Sep 09 Javascript
JQuery each()函数如何优化循环DOM结构的性能
Dec 10 Javascript
用JS将搜索的关键字高亮显示实现代码
Nov 08 Javascript
为Javascript中的String对象添加去除左右空格的方法(示例代码)
Nov 30 Javascript
节点的插入之append()和appendTo()的用法介绍
Jan 13 Javascript
javascript获取四位数字或者字母的随机数
Jan 09 Javascript
jQuery实现的在线答题功能
Apr 12 Javascript
JQuery+EasyUI轻松实现步骤条效果
Feb 22 Javascript
BootStrap modal模态弹窗使用小结
Oct 26 Javascript
在网页中插入百度地图的步骤详解
Dec 02 Javascript
webpack4 升级迁移的实现
Sep 12 Javascript
js数值计算时使用parseInt进行数据类型转换(jquery)
Oct 07 #Javascript
js交换排序 冒泡排序算法(Javascript版)
Oct 04 #Javascript
Javascript获取当前时间函数和时间操作小结
Oct 01 #Javascript
js事件绑定快捷键以ctrl+k为例
Sep 30 #Javascript
显示今天的日期js代码(阳历和农历)
Sep 30 #Javascript
gridview生成时如何去掉style属性中的border-collapse
Sep 30 #Javascript
javascript学习笔记(四)function函数部分
Sep 30 #Javascript
You might like
在DC的漫画和电影中,蝙蝠侠的宿敌,小丑的真名是什么?
2020/04/09 欧美动漫
一贴学会PHP 新手入门教程
2009/08/03 PHP
用php实现的下载css文件中的图片的代码
2010/02/08 PHP
PHP中使用json数据格式定义字面量对象的方法
2014/08/20 PHP
Yii 2中的load()和save()示例详解
2017/08/03 PHP
laravel excel 上传文件保存到本地服务器功能
2019/11/14 PHP
php生成随机数/生成随机字符串的方法小结【5种方法】
2020/05/27 PHP
动态刷新 dorado树的js代码
2009/06/12 Javascript
javascript 折半查找字符在数组中的位置(有序列表)
2010/12/09 Javascript
深入理解JavaScript系列(9) 根本没有“JSON对象”这回事!
2012/01/15 Javascript
文本框获得焦点和失去焦点的判断代码
2012/03/18 Javascript
JavaScript 盒模型 尺寸深入理解
2012/12/31 Javascript
js从10种颜色中随机取色实现每次取出不同的颜色
2013/10/23 Javascript
httpclient模拟登陆具体实现(使用js设置cookie)
2013/12/11 Javascript
JavaScript实现跑马灯抽奖活动实例代码解析与优化(一)
2016/02/16 Javascript
AngularJS基础 ng-mouseover 指令简单示例
2016/08/02 Javascript
再谈javascript常见错误及解决方法
2016/09/16 Javascript
用headjs来管理和加载js 提高网站加载速度
2016/11/29 Javascript
jQuery实现加入收藏夹功能(主流浏览器兼职)
2016/12/24 Javascript
基于Node的React图片上传组件实现实例代码
2017/05/10 Javascript
Angular+Node生成随机数的方法
2017/06/16 Javascript
vue.js做一个简单的编辑菜谱功能
2018/05/08 Javascript
对vux点击事件的优化详解
2018/08/28 Javascript
vue中实现点击按钮滚动到页面对应位置的方法(使用c3平滑属性实现)
2019/12/29 Javascript
[50:02]完美世界DOTA2联赛PWL S2 Magma vs FTD 第三场 11.29
2020/12/03 DOTA
python使用mysql的两种使用方式
2018/03/07 Python
spark: RDD与DataFrame之间的相互转换方法
2018/06/07 Python
详解Python安装tesserocr遇到的各种问题及解决办法
2019/03/07 Python
python sklearn常用分类算法模型的调用
2019/10/16 Python
Python tkinter之Bind(绑定事件)的使用示例
2021/02/05 Python
职称自我鉴定
2013/10/15 职场文书
导游实习生自荐书
2014/01/28 职场文书
绿化先进工作者事迹材料
2014/01/30 职场文书
经贸专业毕业生求职信
2014/03/23 职场文书
先进个人事迹材料范文
2014/12/30 职场文书
小时代观后感
2015/06/10 职场文书