<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>表单验证</title>

<script language="javascript">

function check_1(param){//不为空

    if(param==""||param==null){return false;}else{return true;}    

}

function check_2(param){//长度限制,字母是10个。汉字也是10个

    if(param.length>10){return false;}else{return true;}    

}

function check_3(param){//仅仅能输入汉字

    var pattern= /^[\u4e00-\u9faf]+$/;

    var flag = pattern.test(param);

    if(flag==false){return false;}else{return true;}    

}

function check_4(param){//仅仅能输入数字

    var pattern= /^[0-9]+$/;

    var flag = pattern.test(param);

    if(flag==false){return false;}else{return true;}    

}

function check_5(param){//仅仅能输入数字字母下划线

    var pattern= /^[0-9a-zA-z_]+$/;

    var flag = pattern.test(param);

    if(flag==false){return false;}else{return true;}    

}

function check_6(param){//邮箱格式验证

    var pattern= /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?

)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;

    var flag = pattern.test(param);

    if(flag==false){return false;}else{return true;}    

}

function check_7(param){//网址格式验证

    var pattern= /^((https|http|ftp|rtsp|mms)?:\/\/)?(([0-9a-z_!~*'().&=+$%-]+: )?

[0-9a-z_!~*'().&=+$%-]+@)?

(([0-9]{1,3}\.){3}[0-9]{1,3}|([0-9a-z_!~*'()-]+\.)*([0-9a-z][0-9a-z-]{0,61})?[0-9a-z]\.[a-z]{2,6})(:[0-9]{1,4})?

((\/?)|(\/[0-9a-z_!~*'().;?:@&=+$,%#-]+)+\/?)$/;

    var flag = pattern.test(param);

    if(flag==false){return false;}else{return true;}    

}

function check(){

    var value=document.getElementById("testValue").value;

    var result=check_7(value);//在这里设置验证函数的名称，我写了check_1~check_7七个经常使用的表单验证函数

    if(result==false){

    document.getElementById("testValue").style.border="2px solid red";

    }else{

    //document.getElementById("testValue").style.border="2px solid green";

    document.getElementById("testValue").style.border="";

    }

}

</script>

</head>

<body>

<div style="text-align: center;padding: 200px 0;">

请输入： <input id="testValue" name="" class="" type="text" style="width:200px;height:30px;"></input>

        <input id="" name="" class="" type="button" value="点击验证" style="width:70px;height:30px;" onclick="check()"></input>

</div>

</body>

</html>

JS经常使用表单验证总结的更多相关文章

  1. ★★★【卡法 常用js库】： js汇合 表单验证 cookie设置 日期格式 电话手机号码 email 整数 小数 金额 检查参数长度

    [卡法 常用js库]: js汇合 表单验证  cookie设置  日期格式  电话手机号码  email  整数  小数  金额   检查参数长度 // +---------------------- ...

  2. js基础-表单验证和提交

    基础知识: 原始提交如下: <form action="/login" method="post" id="form1"> &l ...

  3. JS通用表单验证函数,基于javascript正则表达式

    表单的验证在实际的开发当中是件很烦琐又无趣的事情今天在做一个小项目的时候,需要JS验证,寻找到一个比较好的东西 地址如下: http://blog.csdn.net/goodfunman/archiv ...

  4. JS简单表单验证

    这里我是写了一个简单的注册表单验证功能,亲测有效,一起来看看吧! 首先我的HTML代码是这样的: class大家可以忽略一下,这里我项目使用的是bootstrap的样式. 输入用户名和密码用的是正则表 ...

  5. 表单提交学习笔记（二）—使用jquery.validate.js进行表单验证

    一.官网下载地址:http://plugins.jquery.com/validate/ 二.用法 1.在页面上进行引用 <script src="~/scripts/jquery-1 ...

  6. 原生js的表单验证

    最近在学原生的js,把一些练手的代码往博客放一放,权当积累经验,若有错漏,或是觉得浅显,大家不要见怪. 这是一个原生js编写的简单的表单验证: <!DOCTYPE html><htm ...

  7. js——form表单验证

    用js实现一个简易的表单验证 效果: 代码: <html> <head> <title>js校验form表单</title> <meta char ...

  8. 原生JS写表单验证提交功能

    先上效果图: 表单的基础内容就是昵称判断.手机号判断.邮箱判断.身份证号码判断,这里是用到正则验证检验格式. 页面的表单写法就是一个form的提交.输入框用input来实现,输入内容用value来获取 ...

  9. 原生js制作表单验证，基本的表单验证方法

    表单验证是web前端最常见的功能之一,也属于前端开发的基本功.自己完成一个表单验证的开发,也有助于加深对字符串处理和正则表达式的理解. 基本的表单验证包括如:字母验证.数字验证.字母和数字验证.汉字验 ...

随机推荐

  1. Django day08 多表操作 (二) 添加表记录

    一: 一对多 1. 一对多新增 两种方式:  publish = 对象    publish_id = id 1. publish_id 和 publish 的区别就是: 1)publish_id 可 ...

  2. 【STM32H7教程】第23章 STM32H7的MPU内存保护单元（重要）

    完整教程下载地址:http://forum.armfly.com/forum.php?mod=viewthread&tid=86980 第23章       STM32H7的MPU内存保护单元 ...

  3. 打开手机摄像头扫描二维码或条形码全部操作（代码写的不好，请提出指教，共同进步，我只是一个Android的小白）

    (1)下载二维码的库源码 链接:http://pan.baidu.com/s/1pKQyw2n 密码:r5bv 下载完成后打开可以看到 libzxing 的文件夹,最后添加进 Android  Stu ...

  4. Android贝塞尔曲线应用-跳动的水滴

    主要通过6个控制点实现. val startPoint = PointF() val endPoint = PointF() val control1 = PointF() val control2 ...

  5. php数据库批量删除

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  6. 【sqli-labs】 less32 GET- Bypass custom filter adding slashes to dangrous chars (GET型转义了'/"字符的宽字节注入)

    转义函数,针对以下字符,这样就无法闭合引号,导致无法注入 ' --> \' " --> \" \ --> \\ 但是,当MySQL的客户端字符集为gbk时,就可能 ...

  7. Python标准模块--logging(转载)

    转载地址:http://www.cnblogs.com/zhbzz2007/p/5943685.html#undefined Python标准模块--logging 1 logging模块简介 log ...

  8. bos开发时,测试卡在登录界面解决

    在BOS工作空间工程路径下新建sp文件夹,如在E:\bosworkspace8.2\Project_0\lib 新建sp文件夹E:\bosworkspace8.2\Project_0\lib\sp.然 ...

  9. 【剑指Offer】34、第一个只出现一次的字符

      题目描述:   在一个字符串(0<=字符串长度<=10000,全部由字母组成)中找到第一个只出现一次的字符,并返回它的位置, 如果没有则返回 -1(需要区分大小写).   解题思路: ...

  10. [转载]Linux内存高，触发oom-killer问题解决

    最近遇到两起Linux的内存问题,其一是触发了oom-killer导致系统挂 首先确认该系统的版本是32位 #uname -a Linux alarm 2.6.9-67.ELsmp #1 SMP We ...