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添加IE的方法和属性的js代码
Mar 25 Javascript
学习ExtJS 访问容器对象
Oct 07 Javascript
javascript自定义函数参数传递为字符串格式
Jul 29 Javascript
js读取并解析JSON类型数据的方法
Nov 14 Javascript
Jquery删除css属性的简单方法
Dec 04 Javascript
详解vue过滤器在v2.0版本用法
Jun 01 Javascript
基于Bootstrap框架菜鸟入门教程(推荐)
Sep 17 Javascript
浅谈node模块与npm包管理工具
Jan 03 Javascript
VSCode中如何利用d.ts文件进行js智能提示
Apr 13 Javascript
JS实现按比例缩小图片宽高
Aug 24 Javascript
Antd的table组件表格的序号自增操作
Oct 27 Javascript
vue3语法糖内的defineProps及defineEmits
Apr 14 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邮件发送,php发送邮件的类
2011/03/24 PHP
php中获取远程客户端的真实ip地址的方法
2011/08/03 PHP
共享自己写一个框架DreamScript
2007/01/20 Javascript
js数据验证集合、js email验证、js url验证、js长度验证、js数字验证等简单封装
2010/05/15 Javascript
在Ubuntu上安装最新版本的Node.js
2014/07/14 Javascript
jQuery经过一段时间自动隐藏指定元素的方法
2015/03/17 Javascript
javascript实现十秒钟后注册按钮可点击的方法
2015/05/13 Javascript
基于JavaScript实现百叶窗动画效果不只单纯flas可以实现
2016/02/29 Javascript
JS操作JSON方法总结(推荐)
2016/06/14 Javascript
微信小程序开发入门基础教程
2017/04/19 Javascript
Angular学习笔记之集成三方UI框架、控件的示例
2018/03/23 Javascript
vue中keep-alive的用法及问题描述
2018/05/15 Javascript
vue实现学生录入系统之添加删除功能
2018/07/11 Javascript
移动端图片上传旋转、压缩问题的方法
2018/10/16 Javascript
优雅的处理vue项目异常实战记录
2019/06/05 Javascript
Python 多线程Threading初学教程
2017/08/22 Python
Python断言assert的用法代码解析
2018/02/03 Python
Python 实现王者荣耀中的敏感词过滤示例
2019/01/21 Python
python GUI库图形界面开发之PyQt5 Qt Designer工具(Qt设计师)详细使用方法及Designer ui文件转py文件方法
2020/02/26 Python
浅谈Python爬虫原理与数据抓取
2020/07/21 Python
OpenCV读取与写入图片的实现
2020/10/13 Python
翻新二手苹果产品的网络领导者:Mac of all Trades
2017/12/19 全球购物
英国最出名高街品牌:Forever Unique
2018/02/24 全球购物
Timberland德国官网:靴子、鞋子、衣服、夹克及配件
2019/12/10 全球购物
医大实习自我鉴定
2013/12/07 职场文书
有关打架的检讨书
2014/01/25 职场文书
说明书怎么写
2014/05/06 职场文书
个人求职自荐信范文
2014/06/20 职场文书
副乡长民主生活会个人对照检查材料思想汇报
2014/10/01 职场文书
营业员岗位职责范本
2015/04/14 职场文书
辩护词格式
2015/05/22 职场文书
描述鲁迅的名言整理,一生受用
2019/08/08 职场文书
css背景和边框标签实例详解
2021/05/21 HTML / CSS
MySQL 四种连接和多表查询详解
2021/07/16 MySQL
dubbo服务整合zipkin详解
2021/07/26 Java/Android
SQL CASE 表达式的具体使用
2022/03/21 SQL Server