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加密解密7种方法总结分析
Oct 07 Javascript
WEB页子窗口(showModalDialog和showModelessDialog)使用说明
Oct 25 Javascript
在网页中使用document.write时遭遇的奇怪问题
Aug 24 Javascript
JQuery显示、隐藏div的几种方法简明总结
Apr 16 Javascript
js获取微信版本号的方法
May 12 Javascript
Atitit.js的键盘按键事件捆绑and事件调度
Apr 01 Javascript
BootStrap无限级分类(无限极分类封装版)
Aug 26 Javascript
浅析JavaScript动画模拟拖拽原理
Dec 09 Javascript
使用vue-infinite-scroll实现无限滚动效果
Jun 22 Javascript
JS实现方形抽奖效果
Aug 27 Javascript
JS原生带缩略图的图片切换效果
Oct 10 Javascript
使用node-media-server搭建一个简易的流媒体服务器
Jan 20 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
WINDOWS下php5.2.4+mysql6.0+apache2.2.4+ZendOptimizer-3.3.0配置
2008/03/28 PHP
Notice: Undefined index: page in E:\PHP\test.php on line 14
2010/11/02 PHP
PHP中让json_encode不自动转义斜杠“/”的方法
2017/02/28 PHP
js程序中美元符号$是什么
2008/06/05 Javascript
常见的原始JS选择器使用方法总结
2014/04/09 Javascript
js与C#进行时间戳转换
2014/11/14 Javascript
jQuery实现点击按钮弹出可关闭层的浮动层插件
2015/09/19 Javascript
Jquery左右滑动插件之实现超级炫酷动画效果附源码下载
2015/12/02 Javascript
基于angularjs实现图片放大镜效果
2016/08/31 Javascript
Angular ng-repeat 对象和数组遍历实例
2016/09/14 Javascript
JS框架之vue.js(深入三:组件1)
2016/09/29 Javascript
微信小程序开发实现的IP地址查询功能示例
2019/03/28 Javascript
基于elementUI使用v-model实现经纬度输入的vue组件
2019/05/12 Javascript
在 Vue 应用中使用 Netlify 表单功能的方法详解
2019/06/03 Javascript
微信小程序如何使用canvas二维码保存至手机相册
2019/07/15 Javascript
JS如何在数组指定位置插入元素
2020/03/10 Javascript
python使用cookielib库示例分享
2014/03/03 Python
Python中的pass语句使用方法讲解
2015/05/14 Python
Python编程之event对象的用法实例分析
2017/03/23 Python
Python+PyQT5的子线程更新UI界面的实例
2019/06/14 Python
Django 创建后台,配置sqlite3教程
2019/11/18 Python
python3使用Pillow、tesseract-ocr与pytesseract模块的图片识别的方法
2020/02/26 Python
python脚本实现mp4中的音频提取并保存在原目录
2020/02/27 Python
python GUI计算器的实现
2020/10/09 Python
NBA欧洲商店(法国):NBA Europe Store FR
2016/10/19 全球购物
粉红色的鲸鱼:Vineyard Vines
2018/02/17 全球购物
菲律宾票务网站:StubHub菲律宾
2018/04/21 全球购物
监理资料员岗位职责
2014/01/03 职场文书
珠宝店促销方案
2014/03/21 职场文书
初中成绩单评语
2014/12/29 职场文书
投资意向协议书
2015/01/29 职场文书
2015年事业单位办公室文员工作总结
2015/04/24 职场文书
投诉信范文
2015/07/02 职场文书
学校趣味运动会开幕词
2016/03/04 职场文书
Python答题卡识别并给出分数的实现代码
2021/06/22 Python
在容器中使用nginx搭建上传下载服务器
2022/05/11 Servers