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 相关文章推荐
刷新时清空文本框内容的js代码
Apr 23 Javascript
jquery之Document元素选择器篇
Aug 14 Javascript
JavaScript打开word文档的实现代码(c#)
Apr 16 Javascript
javascript中判断一个值是否在数组中并没有直接使用
Dec 17 Javascript
Select下拉框模糊查询功能实现代码
Jul 22 Javascript
浅析Node.js:DNS模块的使用
Nov 23 Javascript
基于Vue.js实现简单搜索框
Mar 26 Javascript
flag和jq on 的绑定多个对象和方法(必看)
Feb 27 Javascript
详解vue-router 2.0 常用基础知识点之router-link
May 10 Javascript
完美解决iview 的select下拉框选项错位的问题
Mar 02 Javascript
Node.js 中判断一个文件是否存在
Aug 24 Javascript
vue绑定数字类型 value为数字的实例
Aug 31 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 cout&amp;lt;&amp;lt;的一点看法
2010/01/24 PHP
CI框架中zip类应用示例
2014/06/17 PHP
PHP记录搜索引擎蜘蛛访问网站足迹的方法
2015/04/15 PHP
Symfony2中被遗弃的getRequest()方法分析
2016/03/17 PHP
PHP性能测试工具xhprof安装与使用方法详解
2018/04/29 PHP
PHP数据源架构模式之表入口模式实例分析
2020/01/23 PHP
Prototype ObjectRange对象学习
2009/07/19 Javascript
javascript 设置文本框中焦点的位置
2009/11/20 Javascript
jQuery 源码分析笔记(5) jQuery.support
2011/06/19 Javascript
jQuery.fn和jQuery.prototype区别介绍
2013/10/05 Javascript
ExtJS4 表格的嵌套 rowExpander应用
2014/05/02 Javascript
javascript判断是手机还是电脑访问网页的简单实例分享
2014/06/03 Javascript
node.js中的path.join方法使用说明
2014/12/08 Javascript
AngularJS 中的指令实践开发指南(一)
2016/03/20 Javascript
JavaScript必知必会(七)js对象继承
2016/06/08 Javascript
基于BootStrap环境写jQuery tabs插件
2016/07/12 Javascript
jquery图片放大镜效果
2017/06/23 jQuery
实例详解JavaScript中setTimeout函数的执行顺序
2017/07/12 Javascript
详解vue-cli 接口代理配置
2017/12/13 Javascript
vuex的module模块用法示例
2018/11/12 Javascript
Nuxt.js开启SSR渲染的教程详解
2018/11/30 Javascript
自定义Vue中的v-module双向绑定的实现
2019/04/17 Javascript
python中使用百度音乐搜索的api下载指定歌曲的lrc歌词
2014/07/18 Python
python flask中动态URL规则详解
2019/11/22 Python
浅谈tensorflow之内存暴涨问题
2020/02/05 Python
Python + opencv对拍照得到的图片进行背景去除的实现方法
2020/11/18 Python
Shopee印度尼西亚:东南亚与台湾市场最大电商平台
2018/06/17 全球购物
介绍一下EJB的体系结构
2012/08/01 面试题
如何通过 CSS 写出火焰效果
2021/03/24 HTML / CSS
《苏珊的帽子》教学反思
2014/04/07 职场文书
租房协议书
2014/04/10 职场文书
2014离婚协议书范文两篇
2014/09/15 职场文书
电台广播稿范文
2015/08/19 职场文书
《这片土地是神圣的》教学反思
2016/02/16 职场文书
2019自荐信该如何写呢?
2019/07/05 职场文书
MySQL 覆盖索引的优点
2021/05/19 MySQL