a 标签提交前验证
最近在做验证的时候遇到了submit()与onsubmit()事件冲突的问题，本来想在a标签中添加submit()进行表单的提交，然后在 form中添加onsubmit事件触发验证方法。结果行不通，最后只能选择在java script中进行表单的提交。方案如下：
设置form头部如下：添加id是为了在java script脚本中进行中获取form对象
<form method="post" action="AdminServlet" id="Loginform" >
在a标签中添加onClick()事件，触发java script表单验证的方法loginLayoutValidate()
<a href="javascript:void(0)" onClick="loginLayoutValidate()"/>
function loginLayoutValidate(){
var userName=document.getElementById("userName");
var passWord= document.getElementById("passWord");
var validateCode=document.getElementById("validateCode");
if(userName.value.trim()==""){
alert("用户名不能为空");
return ;
}
else if(passWord.value.trim()==""){
alert("密码不能为空");
return ;
}
else if(validateCode.value.trim()==""){
alert("请输入验证码");
return ;
}
else{
document.getElementById("Loginform").submit();
}
}
例子:
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<title>Document</title>
<script>
function submitcheck() {
if (document.getElementById('name').value == '') {
alert('必须输入网站名！');
document.getElementById('name').focus();
return false;
} else if (document.getElementById('ftp_url').value == '') {
alert('必须输入Ftp地址！');
document.getElementById('ftp_url').focus();
return false;
} else {
document.getElementById('fm_1').submit();
}
}
</script>
</head> <body>
<form action="#" id="fm_1" name="fm_1">
<input type="text" id="name" name="name" required="required">*
<br>
<input type="text" id="ftp_url" name="ftp_url">*
<br>
<input type="submit" value="提交">
<br>
<input type="reset" value="重置">
<br>
<a href="javascript:void(0)" onclick="checkform()">提交</a>
<br><a href="#" onclick="document.fm_1.reset()">重置</a>
</form>
</body> </html>
a 标签提交前验证的更多相关文章
- javascprit form表单提交前验证以及ajax返回json
1.今天要做一个手机验证码验证的功能.需求是前端页面点击发送 短信验证码,后台接收后通过ajax返回到前端,之后前端在提交时候进行验证.思路很简单,不过做的过程还是学到不少的东西. 1.ajax请求后 ...
- jQuery Validate验证框架详解，提交前验证
现在都用h5表单进行验证了,以下方式仅做回忆 https://www.runoob.com/jquery/jquery-plugin-validate.html <!DOCTYPE HTML P ...
- 使用jquery.validate组件进行前端数据验证并实现异步提交前验证检查
学习如鹏网掌上组的项目开发,使用到了前端验证,视频里使用的ValidateForm验证框架,但是我使用的Hui的框架中使用的是jquery.validate验证框架 所以自行学习jquery.vali ...
- Html form 表单提交前验证
可以使用form表单的onsubmit方法,在提交表单之前,对表单或者网页中的数据进行检验. onsubmit指定的方法返回true,则提交数据:返回false不提交数据. 直接看下面的代码: 1 & ...
- springmvc下js控制表单提交（表单提交前检验，提交后获取json返回值）
这个问题我搞了四天,终于搞懂.因为对js很不熟悉.郁闷的是后台代码出错总可以设置断点调试,前端js代码出错只能通过浏览器提供一些运行数据来分析,很不习惯. 首先说下逻辑:这是一个注册功能,我希望,注册 ...
- 利用javascript对提交数据验证
优点:提交前验证.在客户端进行. <html> <head> <script language="javascript"> function c ...
- a标签指定的url，在表单提交前进行js验证的实现
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 验证控件,解决用于ajax提交前的验证，不是submit提交的验证
//解决ajax提交前的验证问题,主要用于onclick事件时对某一区域中(可以是form,div,table中的等)控件的验证.(function ($) { var v; //Create a n ...
- form的onsubmit事件--表单提交前的验证最佳实现方式
今天遇到了一个问题,页面中include了很多的公共页面(都是没有form的),并且里面好多的地方都是自行提交的(页面中加入一个type=“submit”域,然后js中写入sumbit.click来执 ...
随机推荐
- 2016-10-17: source insight插件
使用快捷键注释,单行注释,多行注释,#if 0注释 将文件 mycomment.em点此下载放到sourceinsight的Base工程的路径下(一般是在C:\Documents and Settin ...
- cache-contro页面缓存处理设置
<meta http-equiv="pragma" content="no-cache">,pragma与no-cache用于定义页面缓存,不缓存页 ...
- java小白来报道
即将开启我的搬码生涯,奋斗吧,少年!
- 将Excel数据导入数据库
Excel如下,这页工作表名叫“线路” 数据库表如下 using System; using System.Collections.Generic; using System.Linq; using ...
- DAO实例代码优化
一般在接口的实现类中不用来实现登陆等功能,在测试类中实现并且测试. package com.beiwo.epet.service.impl; import com.beiwo.epet.dao.Mas ...
- Badboy使用数据源Excel进行脚本参数化
1.首先新建一个Excel,这里示例我写得非常简单,由两由数据组成,第一行为表头.见下图: 2.录制脚本,见上一篇,录制一个非常简单的搜狗查询 3.添加数据源,在Tools面板中找到Data Sour ...
- 构建Maven聚合工程
最近,准备构建一个Maven的项目,基于模块化的结构思想,决定使用Maven的聚合工程进行构建. 环境准备: (1)eclipse 这里推荐使用spring封装的eclipse(即STS) ,STS中 ...
- 常用JS效果 需要时更新。。。
1.手风琴效果 JS: $(function() { var aMenuOneLi = $(".menu-one > li"); var aMenuTwo = ...
- Excel 读写程序 C#源代码下载
http://u.163.com/lNaJAjOz 提取码: E4ZHjnfD
- mave的变量说明
Maven提供了三个隐式的变量可以用来访问环境变量,POM信息,和Maven Settings env env变量,暴露了你操作系统或者shell的环境变量.便 如在Maven POM中一个对${en ...