可以使用form表单的onsubmit方法,在提交表单之前,对表单或者网页中的数据进行检验。

onsubmit指定的方法返回true,则提交数据;返回false不提交数据。

直接看下面的代码:

 1 <HTML>
2 <head>
3 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
4 </head>
5 <BODY>
6 <form action="http://www.baidu.com" onsubmit="return toVaild()">
7 <input type="text" id="ff">
8 <input type="submit" id="submit" value ="提交"/>
9 </form>
10 </BODY>
11 <script language="javascript">
12 function toVaild(){
13 var val = document.getElementById("ff").value;
14 alert(val);
15 if(val == "可以提交"){
16 alert("校验成功,之后进行提交");
17 return true;
18 }
19 else{
20 alert("校验失败,不进行提交");
21 return false;
22 }
23 }
24 </script>
25 </HTML>

上面的网页中,只有在id="ff"的输入框中输入“可以提交”,才进行表单提交;否则不提交。

 
 

Html form 表单提交前验证的更多相关文章

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

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

  2. JavaScript form表单提交与验证

    原网址:https://blog.csdn.net/vipwxs/article/details/79119701 一.form对象的属性: name:获取表单的名称,该name一般给JS使用 met ...

  3. Django之form表单提交并验证

    1.提交的时候会报错 2. 需要在setting里面注释掉一句话,关闭跨站请求检查. 3. 注释掉以后,理论上就不报错了.可我还是卡壳了. 4. 通过在网上找方法,修复错误. 原因:表单action字 ...

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

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

  5. Form表单提交,js验证

    Form表单提交,js验证 1,  Onclick() 2, Onsubmit() Button标签 input (属性 submit  button )标签 Input type=button    ...

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

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

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

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

  8. input file 在开发中遇到的问题 类似ajax form表单提交 input file中的文件

    最近在做项目的过程中遇到个问题,在这里做个记录防止日后忘记 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为 ...

  9. ajax form表单提交 input file中的文件

    ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...

随机推荐

  1. 【转】Oracle集合操作函数:union、intersect、minus

    集合操作符专门用于合并多条select 语句的结果,包括:UNION, UNION ALL, INTERSECT, MINUS.当使用集合操作符时,必须确保不同查询的列个数和数据类型匹配. 集合操作符 ...

  2. formData_html5_map标签

    1 : //更省事 var files = fileInput.files; var formData = new FormData(); //将所有文件插入formData formData .ap ...

  3. hdu1561 树形dp + 背包

    #include<cstdio> #include<cstring> #include<iostream> #define INF 999999999 using ...

  4. js-定时任务setInterval,setTimeout,clearInterval,clearTimeout

    setInterval()循环执行相应的方法 <script type="text/javascript"> setInterval("myInterval( ...

  5. Netbeans 中的编译器相关配置

    gcc-core:C 编译器 gcc-g++:C++ 编译器 gdb:GNU 调试器 make:"make" 实用程序的 GNU 版本

  6. [IOS+PHP Jason格式的发送与解析]

    服务器端PHP文件connect.php: <?php $q = mysql_connect("localhost","root","" ...

  7. hdu acmsteps 2.1.3 Cake

    Cake Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Submissi ...

  8. windows ubuntu双系统启动

    开始安装系统 1.安装系统 首先安装windows8和ubuntu12.04,安装先后顺序可以不用管,只是安装到ubuntu的分区时需要注意device for boot loader install ...

  9. VMware 11安装Mac OS X 10.11.5虚拟机以及优化心得

    随着苹果WWC大会退出了MAC最新版的10.11.5,本着一颗“极客”的心情,在第一时间用VMWARE虚拟机装上了.然后各种卡顿这里分享一下优化mac虚拟机的心得. 1 从Dock上移除Dashboa ...

  10. POJ2049Finding Nemo(bfs + 构图)

    Finding Nemo Time Limit: 2000MS   Memory Limit: 30000K Total Submissions: 8456   Accepted: 1975 Desc ...