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 相关文章推荐
Javascript string 扩展库代码
Apr 09 Javascript
Jquery知识点一 Jquery的ready和Dom的onload的区别
Jan 15 Javascript
javascript中的=等号个数问题两个跟三个有什么区别
Oct 23 Javascript
js实现文本框输入文字个数限制代码
Dec 25 Javascript
js仿QQ邮箱收件人选择与搜索功能
Feb 10 Javascript
jQuery实现弹幕效果
Feb 17 Javascript
BootStrap模态框和select2合用时input无法获取焦点的解决方法
Sep 01 Javascript
vue element-ui 绑定@keyup事件无效的解决方法
Mar 09 Javascript
vue-cli2 构建速度优化的实现方法
Jan 08 Javascript
详解vuex持久化插件解决浏览器刷新数据消失问题
Apr 15 Javascript
JavaScript强制类型转换和隐式类型转换操作示例
May 01 Javascript
Vue 3.0中jsx语法的使用
Nov 13 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
PHP经典的给图片加水印程序
2006/12/06 PHP
php知道与问问的采集插件代码
2010/10/12 PHP
phpmail类发送邮件函数代码
2012/02/20 PHP
获取用户Ip地址通用方法与常见安全隐患(HTTP_X_FORWARDED_FOR)
2013/06/01 PHP
php生成excel列名超过26列大于Z时的解决方法
2014/12/29 PHP
学习php设计模式 php实现备忘录模式(Memento)
2015/12/09 PHP
phpcms的分类名称和类别名称的调用
2017/01/05 PHP
更正确的asp冒泡排序
2007/05/24 Javascript
用js实现下载远程文件并保存在本地的脚本
2008/05/06 Javascript
验证用户是否修改过页面的数据的实现方法
2008/09/26 Javascript
javascript对talbe进行动态添加、删除、验证实现代码
2012/03/29 Javascript
基于jquery的bankInput银行卡账号格式化
2012/08/22 Javascript
15条JavaScript最佳实践小结
2013/08/09 Javascript
js 异步操作回调函数如何控制执行顺序
2013/12/24 Javascript
javascript获取dom的下一个节点方法
2014/09/05 Javascript
Bootstrap表格和栅格分页实例详解
2016/05/20 Javascript
jquery自定义表单验证插件
2016/10/12 Javascript
Angular2表单自定义验证器的实现
2016/10/19 Javascript
JavaScript仿聊天室聊天记录
2016/12/27 Javascript
JS验证字符串功能
2017/02/22 Javascript
js实现不提示直接关闭网页窗口
2017/03/30 Javascript
JavaScript 用fetch 实现异步下载文件功能
2017/07/21 Javascript
详解webpack3如何正确引用并使用jQuery库
2017/08/26 jQuery
OkHttp踩坑随笔为何 response.body().string() 只能调用一次
2018/01/08 Javascript
JS使用队列对数组排列,基数排序算法示例
2019/03/02 Javascript
vue实现路由懒加载的3种方法示例
2020/09/01 Javascript
python网络编程学习笔记(一)
2014/06/09 Python
Python操作MySQL模拟银行转账
2018/03/12 Python
Python中使用__new__实现单例模式并解析
2019/06/25 Python
Anaconda的安装与虚拟环境建立
2020/11/18 Python
英国口碑最好的的维他命胶囊品牌:Myvitamins(有中文站)
2016/12/03 全球购物
七夕活动策划方案
2014/08/16 职场文书
高中升旗仪式演讲稿
2014/09/09 职场文书
党员检讨书范文
2014/12/27 职场文书
单位考核鉴定意见
2015/06/05 职场文书
《彼得与狼》教学反思
2016/02/20 职场文书