`
fox.tan
  • 浏览: 63660 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

最简单的JavaScript validation

阅读更多

JS validation、JS check、Form check

    //obj - input object
    //required 是否必填
    //type 校验类型,date-日期类型,num-浮点数字类型,lnum=整数
    //maxLen - 长度校验
     
      //校验整数
      function checkLNum(theNum){
              var patrn=/^[0-9]{1,20}$/;
              if (!patrn.exec(theNum)) return false
              return true  
      }
     
      //校验浮点数
      function checkNum(theNum){
              var patrn=/^[0-9.]{1,20}$/;
              if (!patrn.exec(theNum)) return false
              return true  
      }
     
      //校验最大长度
      function checkMaxLen(theStr,maxLen){
            if(theStr.length > maxLen)
                  return false;
            return true;
      }
     
      //校验日期格式,YYYY- MM-DD
      function checkDate(theDate){
        var reg = /^\d{4}-((0{0,1}[1-9]{1})|(1[0-2]{1}))-((0{0,1}[1-9]{1})|([1-2]{1}[0-9]{1})|(3[0-1]{1}))$/;
        var result=true;
        if(!reg.test(theDate))
            result = false;
        else{
            var arr_hd=theDate.split("-");
            var dateTmp;
            dateTmp= new Date(arr_hd[0],parseFloat(arr_hd[1])-1,parseFloat(arr_hd[2]));
            if(dateTmp.getFullYear()!=parseFloat(arr_hd[0])
                  || dateTmp.getMonth()!=parseFloat(arr_hd[1]) -1
                    || dateTmp.getDate()!=parseFloat(arr_hd[2])){
                    result = false
            }
        }
        return result;
      }

  function getSpanObject(spanId){
        return document.getElementById(spanId);
  }
 

HTML测试代码:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf8" />
<title>JS Check</title>
<script Language=JavaScript src="check.js"></script>
<script Language=JavaScript>
            function formSubmit(){
                  var flag = check(testForm.startDate,true,'date',12);
                  flag = check(testForm.total,false,'num') && flag;
                  flag = check(testForm.name,true,'other',6) && flag;
                  if(flag){
                        return testForm.submit();
                  }
            }
</script>
</head>
<body>
      <form name="testForm">
            Date:<input type="text" name="startDate" onblur="check(this,true,'date',12)" /><span id="startDateErr" style="color:red"></span><br/>
            Num:<input type="text" name="total" onblur="check(this,false,'num')"/><span id="totalErr" style="color:red"></span><br/>
            String:<input type="text" name="name" onblur="check(this,true,'other',6)"/><span id="nameErr" style="color:red"></span><br/>
            <input type="button" value="Submit" onclick="formSubmit()"/>
      <form>
</body>

 
分享到:
评论

相关推荐

    FormValidation:最简单JavaScript表单验证

    简单实现jQuery表单验证插件。 只需将HTML字段添加到其中,即可向您的输入字段添加验证。 一个例子可能看起来像这样: &lt; input type =" text " fv-email =" This must be a valid email. " name =" email " ...

    jquery-validation-1.17.0

    jQuery Validation是Web开发中一个广泛使用的JavaScript库,主要用于表单验证。该插件以其简单易用和强大的功能著称,大大简化了前端数据验证的过程。在本文中,我们将深入探讨jQuery Validation 1.17.0版本的相关...

    表单验证类 基于prototype的validation.js

    `validation.js`是一个专门用于前端表单验证的库,它基于Prototype JavaScript框架构建,提供了一种简单且灵活的方式来实现这一功能。 **Prototype框架** 是一个广泛使用的JavaScript库,它扩展了JavaScript语言的...

    JavaScript最简单的验证手法

    在本文中,我们将深入探讨JavaScript中最简单的验证手法,特别是如何利用正则表达式进行高效、灵活的验证。 一、正则表达式基础 正则表达式(Regular Expression)是一种模式匹配工具,用于在文本中查找、替换或...

    Jquery前端表单验证插件formvalidation源码及示例

    2. **初始化表单**:使用JavaScript或jQuery选择器找到表单元素,并调用`.formValidation()`方法进行初始化。 3. **配置验证规则**:在初始化时设置验证规则,指定哪些字段需要验证,以及它们应遵循的规则。 4. **...

    Bootstrap formValidation

    在使用Bootstrap FormValidation时,首先要确保项目已经引入了Bootstrap的CSS和JavaScript,然后引入FormValidation的相关文件,接着在表单元素上设置验证规则,最后通过初始化函数启动验证。例如: ```html ...

    jQuery插件之validation插件

    最常使用javascript的场合就是表单的验证,而jQuery作为一个优秀的javascript库,也提供了一个优秀的表单验证插件——Validation。Validation是历史最悠久的jQuery插件之一,经过了全球范围内不同项目的验证,并得到...

    最简单的表单验证框架发布

    标题“最简单的表单验证框架发布”提示我们讨论的主题是一个用于验证HTML表单的轻量级框架。在网页开发中,表单验证是确保用户输入数据有效性和安全性的关键步骤。这个框架可能简化了常见的验证规则,使得开发者可以...

    jquery.validate_Validation

    jQuery Validate是一个强大的表单验证插件,它为开发者提供了简单易用的API,用于确保用户在提交表单时输入的数据满足特定的格式和要求。该插件大大简化了前端数据验证的过程,提高了用户体验,避免了无效或错误的...

    Bootstrap 表单验证formValidation 实现远程验证功能

    首先,formValidation是一个强大的JavaScript库,专为表单验证设计。它提供了丰富的验证规则和灵活的配置选项,可以方便地集成到Bootstrap或其他前端框架中。在开始之前,确保你已经引入了必要的资源文件,包括...

    email-validation:一个完整的电子邮件验证脚本

    这个名为"email-validation"的项目提供了一个完整的JavaScript脚本来实现这一功能。JavaScript是一种广泛用于客户端网页开发的编程语言,它可以直接在用户的浏览器上运行,无需服务器交互,非常适合进行实时数据验证...

    easy-validation:用于基于HTML5的验证的简单polyfill

    用于基于HTML5的验证的简单polyfill API 我们的验证策略涉及使用支持HTML5的浏览器的内置验证机制,在不支持HTML5的浏览器中回退到基于JavaScript的验证方案,最后在非JavaScript场景中降级到服务器端验证。 HTML5...

    JavaScript_JS中最强大的数据验证库.zip

    console.log('Validation successful'); } ``` 在这个例子中,`userSchema`定义了用户名必须是字母数字字符,长度在3到30之间,而密码也遵循同样的规则。如果输入的数据不符合规则,`validate()`方法会返回一个...

    验证用户是否注册 JavaScript AJax

    接下来,我们创建一个名为`validation.js`的JavaScript文件,用于处理表单提交和AJAX请求: ```javascript document.getElementById('registrationForm').addEventListener('submit', function(e) { e....

    rule-validation-api:简单的规则验证API

    使用`rule-validation-api` 进行数据验证时,开发者应遵循最佳实践,如先验证最常出错的规则,以及将复杂的验证规则分解为更小、可复用的部分。 通过理解这些关键概念,开发者可以有效地利用`rule-validation-api`...

    react-form-validation

    React.js,一个由Facebook开发并维护的JavaScript库,以其组件化思维和声明式编程风格,使得构建表单验证变得简单而高效。本文将深入探讨如何使用React.js来创建具有验证功能的Web表单,并结合React Router v4实现多...

    JavaScript-Projects:JavaScript算法和数据结构

    凯撒密码 :key: 凯撒密码技术是最早,最简单的加密技术之一。 这只是一种替换密码,即给定文本的每个字母都被一个固定位置的字母替换为字母。 例如,如果密码是ROT1(旋转1个字母),则消息中的每个a将显示为b。 我...

    javascript常见数据验证插件大全

    以下是一个简单的电话号码验证函数: ```javascript function isPhoneNumber(phoneNumber) { const regex = /^1[3-9]\d{9}$/; return regex.test(phoneNumber); } // 使用示例 const phoneInput = document....

    ASP.NET jQuery 实例12 通过使用jQuery validation插件简单实现用户注册页面验证功能

    首先,开发者不必编写大量的JavaScript代码来手动检查每个字段的有效性。其次,jQuery validation插件具有高度的可定制性,可以很容易地集成到任何项目中。最后,由于该插件广泛使用,因此社区提供的资源和支持都...

    SpringMVC实现Validation校验过程详解

    前端验证通常使用 JavaScript 在客户端进行验证,这种方法简单易行,但是在安全性方面有一定的风险。如果攻击者绕过前端验证,那么后端验证变得非常重要。SpringMVC 使用 JSR-303(JavaEE6 规范的一部分)校验规范来...

Global site tag (gtag.js) - Google Analytics