用submit()提交表单致使onsubmit失效解决方法
用submit()提交表单 致使onsubmit失效解决方法 onclick方法失效
=========================================================================
下边本文中将要用到的脚本
程序代码
<script language="javascript">
//表单提交
function submit1(obj){
obj.submit();
}
//表单提交,调用checked函数
function submit2(obj){
return checked();
obj.submit();
}
//表单提交,将ehecked函数内容写入submit3
function submit3(obj){
if(document.form1.username.value == ""){alert("姓名忘了填写?");document.form1.username.focus();return false;}
obj.submit();
}
//表单验证
function checked(){
if(document.form1.username.value == ""){alert("姓名忘了填写?");document.form1.username.focus();return false;}
return true;
}
</script>
复制代码
二、分析过程
1.通常的表单验证法,在form中加入onsumbit事件
程序代码
<form id="form1" name="form1" method="post" action="mzwucom.asp" onsubmit="checked();">
UserNmae:
<input name="username" type="text" id="username" size="10" maxlength="10" />
<input type="submit" name="Submit" value="提交" />
</form>
复制代码
结果:验证机制发生作用!
2.在1的基础上改为通过调用submit()方法提交表单(红色为和1相比修改部分,下同)
程序代码
<form id="form1" name="form1" method="post" action="mzwucom.asp" onsubmit="checked();">
UserNmae:
<input name="username" type="text" id="username" size="10" maxlength="10" />
<input type="button" name="Submit" value="提交" onclick="submit1(this.form);" />
</form>
复制代码
结果:验证机制失效,表单直接提交!
3.在1的基础上去掉onsubmit事件,调用submit2
程序代码
<form id="form1" name="form1" method="post" action="mzwucom.asp">
UserNmae:
<input name="username" type="text" id="username" size="10" maxlength="10" />
<input type="button" name="Submit" value="提交" onclick="submit2(this.form);" />
</form>
复制代码
结果:验证机制发生作用,但正确时表单没有提交,由于return true在submit()前!
4.在1的基础上去掉onsubmit事件,调用submit3
程序代码
<form id="form1" name="form1" method="post" action="mzwucom.asp">
UserNmae:
<input name="username" type="text" id="username" size="10" maxlength="10" />
<input type="button" name="Submit" value="提交" onclick="submit3(this.form);" />
</form>
复制代码
结果:验证机制发生作用,通过则提交表单!
==========================================================
用submit()提交表单 致使onsubmit失效解决方法 onclick方法失效
分享到:
相关推荐
总结来说,`document.forms[].submit()` 是JavaScript中一个非常实用的方法,它允许开发者在代码层面控制表单的提交过程,提高了网页的交互性和动态性。通过深入理解这个方法,开发者可以更好地实现各种复杂的表单...
submit是button的一个特例,也是button的一种,它把提交这个动作...使用button按钮实现submit提交,需要在button标签中的使用onclick方法,然后在JavaScript中实现具体,代码如下: <head> [removed] functio
document.forms[0].submit(); // 提交第一个表单 ``` ### 示例代码分析 在提供的示例中,我们看到这样的代码: ```javascript $(function() { var thisForm = document.forms['form1']; console.info(thisForm....
### JS提交表单及JS表单验证 在Web开发中,JavaScript经常被用来增强用户体验,其中一个重要的应用领域就是表单验证。通过JavaScript进行前端验证,可以及时反馈用户输入错误,提高交互效率。本文将详细解释如何...
根据提供的文件信息,我们可以总结出一系列关于JavaScript在处理表单提交及验证方面的知识点。下面将对这些知识点进行详细的解析。 ### 1. 验证文本框输入长度不超过50个字符 ```javascript function test() { if...
1. 验证事件:在JavaScript中,我们可以监听表单的`submit`事件,当用户尝试提交表单时触发验证。例如: ```javascript document.getElementById('myForm').addEventListener('submit', function(event) { // 验证...
这里通过`document.forms[0].action`将表单的提交地址更改为`${ctx}/sortinfo/saveSortInfoSmall.do`,然后调用`submit()`方法来提交表单。其中`${ctx}`是一个占位符,通常会在服务器端动态替换为实际的上下文路径。...
在IT领域,特别是前端开发中,JavaScript是一种广泛使用的编程语言,用于实现网页的动态效果、交互性和实时更新等功能。在给定的文件信息中,主要涉及的是一个60秒倒计时的小型JavaScript代码实现。下面,我们将深入...
从给定的文件信息中,我们可以总结出一系列与JavaScript表单验证相关的知识点,这些方法涵盖了长度检查、字符类型限制、格式验证以及同名输入的一致性校验等常见需求。 ### 1. 长度限制验证 在第一个示例中,通过`...
根据给定的文件标题、描述、标签以及部分内容,本文将深入解析JavaScript在表单验证中的应用,涵盖多种常见且实用的验证方法。JavaScript是前端开发中不可或缺的一部分,它能够实现动态网页效果,尤其是在用户交互...
本程序中完成提交的方法提供两种,直接提交表单和点击登录按钮提交,还有第三种方法填表完成后直接用WebBrowser1.Document.Forms("login").Submit,如果您安装的是IE7,在VB开发环境下运行可能会遇到莫名其妙的...
### 常用的JS提交表单及JS表单验证代码知识点详解 #### 一、字符串长度限制 在Web开发中,对用户输入的文本进行长度限制是非常常见的需求。例如,确保用户输入的信息不会过长,以免导致数据库字段存储溢出等问题。 ...
5. **提交表单**:`document.forms[0].submit();` 如果一致,则提交表单。 #### 九、屏蔽右键很酷 **知识点概述:** 该功能用于禁止用户通过右键进行操作,如复制、粘贴等,常用于保护网页内容。 **实现代码示例:...
document.forms[0].submit(); } } } ``` - 上述代码通过比较两个密码输入框的值来检查它们是否相同,如果不一致,则提示用户并清除输入框内容;如果一致,则提交表单。 ### 防止右键菜单和选中文本 - 代码...
- 使用`document.forms[0]`获取当前页面中的第一个表单元素,这里假设页面中只有一个表单。 - `password1`和`password2`变量分别存储了两个密码框的值。 - 第一层条件判断检查两个密码框是否都非空,如果有一个为...
例如,对于`POST`提交,可以使用`document.forms[0].elements`来访问表单元素和它们的值;对于`GET`提交,参数会出现在URL的查询字符串中,可以使用`window.location.search`来获取,然后解析查询字符串以提取参数。...