最近在做验证的时候遇到了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 标签提交前验证的更多相关文章

  1. javascprit form表单提交前验证以及ajax返回json

    1.今天要做一个手机验证码验证的功能.需求是前端页面点击发送 短信验证码,后台接收后通过ajax返回到前端,之后前端在提交时候进行验证.思路很简单,不过做的过程还是学到不少的东西. 1.ajax请求后 ...

  2. jQuery Validate验证框架详解,提交前验证

    现在都用h5表单进行验证了,以下方式仅做回忆 https://www.runoob.com/jquery/jquery-plugin-validate.html <!DOCTYPE HTML P ...

  3. 使用jquery.validate组件进行前端数据验证并实现异步提交前验证检查

    学习如鹏网掌上组的项目开发,使用到了前端验证,视频里使用的ValidateForm验证框架,但是我使用的Hui的框架中使用的是jquery.validate验证框架 所以自行学习jquery.vali ...

  4. Html form 表单提交前验证

    可以使用form表单的onsubmit方法,在提交表单之前,对表单或者网页中的数据进行检验. onsubmit指定的方法返回true,则提交数据:返回false不提交数据. 直接看下面的代码: 1 & ...

  5. springmvc下js控制表单提交(表单提交前检验,提交后获取json返回值)

    这个问题我搞了四天,终于搞懂.因为对js很不熟悉.郁闷的是后台代码出错总可以设置断点调试,前端js代码出错只能通过浏览器提供一些运行数据来分析,很不习惯. 首先说下逻辑:这是一个注册功能,我希望,注册 ...

  6. 利用javascript对提交数据验证

    优点:提交前验证.在客户端进行. <html> <head> <script language="javascript"> function c ...

  7. a标签指定的url,在表单提交前进行js验证的实现

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  8. 验证控件,解决用于ajax提交前的验证,不是submit提交的验证

    //解决ajax提交前的验证问题,主要用于onclick事件时对某一区域中(可以是form,div,table中的等)控件的验证.(function ($) { var v; //Create a n ...

  9. form的onsubmit事件--表单提交前的验证最佳实现方式

    今天遇到了一个问题,页面中include了很多的公共页面(都是没有form的),并且里面好多的地方都是自行提交的(页面中加入一个type=“submit”域,然后js中写入sumbit.click来执 ...

随机推荐

  1. ubuntu12.04 gitlab搭建

    最近在尝试内部搭建gitlab,wiki这些工具...我使用的官网的gitlab-ce包一键安装,自己搭建的ubuntu12.04 server服务器. 分配253地址,放在办公室的小角落. 配置过程 ...

  2. java学习第13天( java获取当前时间,有关大数据的运算及精确数字运算,Date类)

    一 java获取当前时间 学习一个函数,得到当前时间的准确值 System.currectTimeMillis(). 可以得到以毫秒为单位的当前时间.它主要用于计算程序运行时间,long start= ...

  3. CXF发布webService服务以及客户端调用

    这篇随笔内容是CXF发布webService服务以及客户端调用的方法 CXF是什么? 开发工作之前需要下载CXF和安装 下载地址:http://cxf.apache.org 安装过程: <1&g ...

  4. Rendering pipeline overview(读书笔记1 --- Real-Time rendering)

    1. Rendering pipeline的作用就是在给定的虚拟相机.三维物体.光源.着色方程式.纹理等的条件下产生(渲染)二维图像 2. pipeline包含很多个stage,其效率由最慢的stag ...

  5. SQL数据库与excel表格之间的数据 导入

  6. C语言字符输出格式化

    转自http://blog.csdn.net/pbymw8iwm/article/details/8153226 符号属性 长度属性 基本型 所占 位数 取值范围 输入符举例 输出符举例 -- -- ...

  7. 第六百零九天 how can I 坚持

    好失败啊,搞了一天,竟然连个环境都没搞好,也是醉了.还是太渣了. 洗澡,睡觉.

  8. seaJS循环依赖的解决原理

    seajs模块的六个状态. var STATUS = {  'FETCHING': 1, // The module file is fetching now. 模块正在下载中  'FETCHED': ...

  9. 正则表达式提取string 中的表名

    简单版本: Regex reg = new Regex(@"(?i)\bfrom\b(?![^\[\]]*\])\s+(\[[^\[\]]+\]|\S+)"); MatchColl ...

  10. leetCode 354. Russian Doll Envelopes

    You have a number of envelopes with widths and heights given as a pair of integers (w, h). One envel ...