form.submit()不能提交表单的错误原因及解决方法


Posted in Javascript onOctober 13, 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 学习点滴记录
Apr 24 Javascript
jQuery实现表单input中提示文字value随鼠标焦点移进移出而显示或隐藏的代码
Mar 21 Javascript
Jquery中的CheckBox、RadioButton、DropDownList的取值赋值实现代码
Oct 12 Javascript
JS定时关闭窗口的实例
May 22 Javascript
解析Jquery中如何把一段html代码动态写入到DIV中(实例说明)
Jul 09 Javascript
深入学习jQuery Validate表单验证
Jan 18 Javascript
由浅入深剖析Angular表单验证
Jul 14 Javascript
JavaScript获取URL参数的方法之一
Mar 24 Javascript
Vuex 使用及简单实例(计数器)
Aug 29 Javascript
支付宝小程序tabbar底部导航
Nov 06 Javascript
在JavaScript中使用严格模式(Strict Mode)
Jun 13 Javascript
详解使用JWT实现单点登录(完全跨域方案)
Aug 02 Javascript
js的touch事件的实际引用
Oct 13 #Javascript
JQuery 使用attr方法实现下拉列表选中
Oct 13 #Javascript
5个JavaScript经典面试题
Oct 13 #Javascript
Json实现异步请求提交评论无需跳转其他页面
Oct 11 #Javascript
innerHTML动态添加html代码和脚本兼容多个浏览器
Oct 11 #Javascript
ie8模式下click无反应点击option无反应的解决方法
Oct 11 #Javascript
JS 获取鼠标左右键的键值方法
Oct 11 #Javascript
You might like
制作美丽的拉花
2021/03/03 冲泡冲煮
PHP中的加密功能
2006/10/09 PHP
php上传文件问题汇总
2015/01/30 PHP
php中使用gd库实现远程图片下载实例
2015/05/12 PHP
破解Session cookie的方法
2006/07/28 Javascript
Javascript常用运算符(Operators)-javascript基础教程
2007/12/14 Javascript
jQuery中prevUntil()方法用法实例
2015/01/08 Javascript
jQuery往返城市和日期查询实例讲解
2015/10/09 Javascript
jQuery实现带玻璃流光质感的手风琴特效
2015/11/20 Javascript
JS仿JQuery选择器功能
2017/03/08 Javascript
Vue.js展示AJAX数据简单示例讲解
2017/03/29 Javascript
原生JS实现图片懒加载(lazyload)实例
2017/06/13 Javascript
Vue 与 Vuex 的第一次接触遇到的坑
2018/08/16 Javascript
webpack实现一个行内样式px转vw的loader示例
2018/09/13 Javascript
JS计算两个数组的交集、差集、并集、补集(多种实现方式)
2019/05/21 Javascript
python 中文字符串的处理实现代码
2009/10/25 Python
kNN算法python实现和简单数字识别的方法
2014/11/18 Python
Python获取DLL和EXE文件版本号的方法
2015/03/10 Python
Python实现快速排序和插入排序算法及自定义排序的示例
2016/02/16 Python
Python、PyCharm安装及使用方法(Mac版)详解
2017/04/28 Python
Python使用Turtle模块绘制五星红旗代码示例
2017/12/11 Python
Python实现二叉搜索树BST的方法示例
2019/07/30 Python
html5 桌面提醒:Notifycations应用介绍
2012/11/27 HTML / CSS
HTML5中图片之间的缝隙完美解决方法
2017/07/07 HTML / CSS
萨克斯第五大道精品百货店: Saks Fifth Avenue
2017/04/28 全球购物
Gloeilampgoedkoop荷兰:在线购买灯泡
2019/02/16 全球购物
德国二手设计师时装和复古时装跳蚤市场:Mädchenflohmarkt
2020/11/09 全球购物
消防安全管理制度
2014/02/01 职场文书
大学生两会精神学习心得体会
2014/03/10 职场文书
英文感谢信格式
2015/01/21 职场文书
幼儿园庆元旦主持词
2015/07/06 职场文书
小学数学教学随笔
2015/08/14 职场文书
Python快速实现一键抠图功能的全过程
2021/06/29 Python
【DOTA2】总决赛血虐~ XTREME GAMING vs MAGMA - OGA DOTA PIT 2022 CN
2022/04/02 DOTA
微信小程序APP页面的之间的相互传递参数以及自定义组件
2022/04/19 Javascript
mysql实现将字符串字段转为数字排序或比大小
2022/06/14 MySQL