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 相关文章推荐
firefox下frameset取不到值的解决方法
Sep 06 Javascript
微信分享的标题、缩略图、连接及描述设置方法
Oct 14 Javascript
javaScript中with函数用法实例分析
Jun 08 Javascript
JS实现点击复选框将按钮或文本框变为灰色不可用的方法
Aug 11 Javascript
JS基于VML技术实现的五角星礼花效果代码
Oct 26 Javascript
谈谈target=_new和_blank的不同之处
Oct 25 Javascript
Bootstrap php制作动态分页标签
Dec 23 Javascript
微信小程序模板消息限制实现无限制主动推送的示例代码
Aug 27 Javascript
vue实现输入一位数字转汉字功能
Dec 13 Javascript
vue实现登录拦截
Jun 29 Javascript
如何在vue 中引入使用jquery
Nov 10 jQuery
vue route新窗口跳转页面并且携带与接收参数
Apr 10 Vue.js
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 mysql索引问题
2008/06/07 PHP
PHP通过iconv将字符串从GBK转换为UTF8字符集
2011/07/18 PHP
PHP中VC6、VC9、TS、NTS版本的区别与用法详解
2013/10/26 PHP
php使用filter过滤器验证邮箱 ipv6地址 url验证
2013/12/25 PHP
php中foreach结合curl实现多线程的方法分析
2016/09/22 PHP
Laravel使用swoole实现websocket主动消息推送的方法介绍
2019/10/20 PHP
DOM 基本方法
2009/07/18 Javascript
基于MooTools的很有创意的滚动条时钟动画
2010/11/14 Javascript
JavaScript内核之基本概念
2011/10/21 Javascript
javascript分页代码(当前页码居中)
2012/09/20 Javascript
js如何判断不同系统的浏览器类型
2013/10/28 Javascript
javascript+canvas制作九宫格小程序
2014/12/28 Javascript
JS实现让访问者自助选择网页文字颜色的方法
2015/02/24 Javascript
轻松掌握JavaScript中介者模式
2016/08/26 Javascript
ionic开发中点击input时键盘自动弹出
2016/12/23 Javascript
JavaScript获取URL参数的方法之一
2017/03/24 Javascript
用纯Node.JS弹出Windows系统消息提示框实例(MessageBox)
2017/05/17 Javascript
微信小程序url传参写变量的方法
2018/08/09 Javascript
浅谈Vue数据响应思路之数组
2018/11/06 Javascript
在 Vue.js中优雅地使用全局事件的方法
2019/02/01 Javascript
Vue响应式原理Observer、Dep、Watcher理解
2019/06/06 Javascript
Tensorflow实现卷积神经网络的详细代码
2018/05/24 Python
Python搭建Spark分布式集群环境
2019/07/05 Python
Pytorch 实现自定义参数层的例子
2019/08/17 Python
经典导游欢迎词大全
2014/01/16 职场文书
结婚周年感言
2014/02/24 职场文书
大学生创业项目方案
2014/03/08 职场文书
出纳担保书范文
2014/04/02 职场文书
计算机专业自荐信范文
2014/05/28 职场文书
党支部创先争优承诺书
2014/08/30 职场文书
项目经理岗位职责
2015/01/31 职场文书
英语读书笔记
2015/07/02 职场文书
Python基础之常用库常用方法整理
2021/04/30 Python
自从在 IDEA 中用了热部署神器 JRebel 之后,开发效率提升了 10(真棒)
2021/06/26 Java/Android
java设计模式--七大原则详解
2021/07/21 Java/Android
mysql性能优化以及配置连接参数设置
2022/05/06 MySQL