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 相关文章推荐
IE JS无提示关闭窗口不提示的方法
Apr 29 Javascript
阻止事件(取消浏览器对事件的默认行为并阻止其传播)
Nov 03 Javascript
js返回前一页刷新本页重载页面
Jul 29 Javascript
jquery checkbox 勾选的bug问题解决方案与分析
Nov 13 Javascript
jQuery根据元素值删除数组元素的方法
Jun 24 Javascript
实例讲解jquery中mouseleave和mouseout的区别
Feb 17 Javascript
Angular 根据 service 的状态更新 directive
Apr 03 Javascript
bootstrapValidator表单验证插件学习
Dec 30 Javascript
AngularJS模糊查询功能实现代码(过滤内容下拉菜单排序过滤敏感字符验证判断后添加表格信息)
Oct 24 Javascript
vue中使用 pako.js 解密 gzip加密字符串的方法
Jun 10 Javascript
详解JavaScript中精度失准问题及解决方法
Feb 04 Javascript
浅谈JS的二进制家族
May 09 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
基于php常用正则表达式的整理汇总
2013/06/08 PHP
PHP四大安全策略
2014/03/12 PHP
php判断两个日期之间相差多少个月份的方法
2015/06/18 PHP
简单谈谈PHP vs Node.js
2015/07/17 PHP
thinkPHP自定义类实现方法详解
2016/11/30 PHP
PHP将数据导出Excel表中的实例(投机型)
2017/07/31 PHP
在云虚拟主机部署thinkphp5项目的步骤详解
2017/12/21 PHP
php面试中关于面向对象的相关问题
2019/02/13 PHP
jquery.blockUI.js上传滚动等待效果实现思路及代码
2013/03/18 Javascript
Extjs4中的分页应用结合前后台
2013/12/13 Javascript
jquery.mousewheel实现整屏翻屏效果
2015/08/30 Javascript
AngularJS 使用 UI Router 实现表单向导
2016/01/29 Javascript
在JavaScript中模拟类(class)及类的继承关系
2016/05/20 Javascript
JQuery用$.ajax或$.getJSON跨域获取JSON数据的实现代码
2017/09/23 jQuery
解决低版本的浏览器不支持es6的import问题
2018/03/09 Javascript
Vue中用props给data赋初始值遇到的问题解决
2018/11/27 Javascript
Angular8路由守卫原理和使用方法
2019/08/29 Javascript
简单了解JavaScript作用域
2020/07/31 Javascript
vue实现打地鼠小游戏
2020/08/21 Javascript
JS访问对象两种方式区别解析
2020/08/29 Javascript
跟老齐学Python之??碌某?? target=
2014/09/12 Python
python同时给两个收件人发送邮件的方法
2015/04/30 Python
python使用docx模块读写docx文件的方法与docx模块常用方法详解
2020/02/17 Python
Python自动发送和收取邮件的方法
2020/08/12 Python
详解基于Scrapy的IP代理池搭建
2020/09/29 Python
纯CSS3实现表单验证效果(非常不错)
2017/01/18 HTML / CSS
HTML5 拖放(Drag 和 Drop)详解与实例代码
2017/09/14 HTML / CSS
美国汽车性能部件和赛车零件网站:Vivid Racing
2018/03/27 全球购物
保安自我鉴定范文
2013/12/08 职场文书
《苏珊的帽子》教学反思
2014/04/07 职场文书
镇班子对照检查材料思想汇报
2014/09/24 职场文书
社区领导班子四风问题原因分析及整改措施
2014/09/28 职场文书
计算机专业自荐信
2015/03/05 职场文书
涨价通知怎么写
2015/04/23 职场文书
帝企鹅日记观后感
2015/06/10 职场文书
Python趣味爬虫之用Python实现智慧校园一键评教
2021/05/28 Python