//javascript代码

    function valForm(){

    var username=document.getElementById("username");

    var pwd=document.getElementById("pwd");

    var repwd=document.getElementById("repwd");

    var email=document.getElementById("email");

    var age=document.getElementById("age");

    var cardid=document.getElementById("cardid");if(username.value==""){

        alert("用户名不能为空");

        return false;

        }else if(username.value.length<4||username.value.length>16){

            alert("用户名长度不符合规则！\n 用户名长度应为4-16个字符");

            return false;

        }else if(pwd.value==""){

             alert("密码不能为空");

             return false;

        }else if(pwd.value!=repwd.value){

            alert("密码不一致");

            return false;

        }else if(email.value.indexOf(".")<0||email.value.indexOf("@")<0){

            alert("邮箱错误");

            return false;

        }else if(parseInt(age.value)<18&&parseInt(age.value)>80) {

            alert("年龄错误");

            return false;

        }else if(reg.test(cardid.value)==false){

            alert("身份证不合法");

            return false;

        }else{

            document.forms[0].submit();

            return false;

            }

    }
//Jquery
$(function(){

        $("#regUser").click(function(){

            if($("#username").val()==""||$("#username").val().length<4){

                alert("用户名不符合要求")

                }else if($("#pwd").val().length<6){

                    alert("密码不符合要求");

                }else if($("#repwd").val()!=$("#pwd").val()){

                    alert("密码不一致")

                }else if($("#email").val().indexOf("@")<0||$("#email").val().indexOf(".")<0){

                    alert("邮箱格式错误")

                }else if($("#age").val()<18||$("#age").val()>80){

                    alert("年龄不符合要求")

                }else{

                    window.location.href="jquery1.html";

                }

            })

        })

body内容

<body>

<form action="js实例.html" method="post">

  <table  border="0">

    <tr>

      <td>用户名</td>

      <td><input type="text" name="username" id="username" /></td>

      <td>&nbsp;</td>

    </tr>

    <tr>

      <td>密码</td>

      <td><input type="password" name="pwd" id="pwd" /></td>

      <td>&nbsp;</td>

    </tr>

    <tr>

      <td>重复密码</td>

      <td><input type="password" name="repwd" id="repwd" /></td>

      <td>&nbsp;</td>

    </tr>

    <tr>

      <td>邮箱：</td>

      <td><input type="text" name="email" id="email" /></td>

      <td>&nbsp;</td>

    </tr>

    <tr>

      <td>年龄：</td>

      <td><input type="text" name="age" id="age" /></td>

      <td>&nbsp;</td>

    </tr>

    <tr>

      <td><a href="#" id="regUser">注册</a></td>

      <td><a href="#" >重置</a></td>

    </tr>

  </table>

</form>

</body>

简单的表单验证(js、jquery)的更多相关文章

  1. 用jQuery写的最简单的表单验证

    近几天完成了关于我们项目的最简单的表单验证,是用jQuery写的,由于之前也一直没学过jQuery,所以自己也是一直处于边摸索边学习的阶段,经过这一段时间的学习,通过查资料啥的,也发现了学习jQuer ...

  2. jQuery框架学习第十一天：实战jQuery表单验证及jQuery自动完成提示插件

    jQuery框架学习第一天:开始认识jQueryjQuery框架学习第二天:jQuery中万能的选择器jQuery框架学习第三天:如何管理jQuery包装集 jQuery框架学习第四天:使用jQuer ...

  3. jQuery 表单验证插件 jQuery Validation Engine 使用

    jQuery 表单验证插件 jQuery Validation Engine 使用方式如下: 1.引入头文件(注意一定要把jQuery放在前面),指定使用 jQuery Validation Engi ...

  4. 表单验证插件jquery.validate的使用方法演示

    jQueryValidate表单验证效果 jquery.validate验证错误信息的样式控制 <!--validate验证插件的基础样式--> input.error{border: 1 ...

  5. angularjs学习第四天笔记（第一篇：简单的表单验证）

    您好,我是一名后端开发工程师,由于工作需要,现在系统的从0开始学习前端js框架之angular,每天把学习的一些心得分享出来,如果有什么说的不对的地方,请多多指正,多多包涵我这个前端菜鸟,欢迎大家的点 ...

  6. Struts2之Action三种接收参数形式与简单的表单验证

    有了前几篇的基础,相信大家对于Struts2已经有了一个很不错的认识,本篇我将为大家介绍一些关于Action接收参数的三种形式,以及简单的表单验证实现,下面进入正题,首先我们一起先来了解一下最基本的A ...

  7. 使用 layUI做一些简单的表单验证

    使用 layUI做一些简单的表单验证 <form method="post" class="layui-form" > <input name ...

  8. jQuery插件 -- 表单验证插件jquery.validate.js, jquery.metadata.js

    原文地址:http://blog.csdn.net/zzq58157383/article/details/7718352   最常使用JavaScript的场合就是表单的验证,而jQuery作为一个 ...

  9. jQuery插件 -- 表单验证插件jquery.validate.js

    最常使用JavaScript的场合就是表单的验证,而jQuery作为一个优秀的JavaScript库,也提供了一个优秀的表单验证插件----Validation.Validation是历史最悠久的jQ ...

随机推荐

  1. 子级Repeater获取 父级Repeater

    第一种方法,子级Repeater中绑定父级的某个字段: <%# DataBinder.Eval((Container.NamingContainer.NamingContainer as Rep ...

  2. DevExpress GridView使用技巧之列标题点击事件

    在这里使用GridView的MouseDown事件.这里同样使用的是GridHitInfo来获取点击位置的信息,来判断是否在列标题上.GridHitInfo根据鼠标点击的x.y坐标获取该点的相关信息, ...

  3. 页面样式base.css

    下面是我用过多次的base.css.欢迎各种建议吐槽.大家共同进步. ;;} table{;} fieldset,img {;} address,caption, cite,code,dfn,em,s ...

  4. Android简单登录系统

    很长时间没有写博客了,最近一直在写android for gis方面的项目.不过这篇博客就不写gis方面的了,今天刚刚做的一个简单的android登录系统.数据库是android自带的sqlite,s ...

  5. radio与checkbox

    最近一直在学习Javascript与asp.net MVC4,每天都在跟着书学习.这样总感觉自己看的很抽象,没有点实际的意义.而且,每次看的东西很容易忘记,所以打算在这里记录自己的学习笔记. Java ...

  6. java中关于窗体居中显示问题

    最近在学着用java写qq聊天程序,首先是登录和聊天界面,书上没有给出居中显示,通过上网查找知道有两种方案 先说第一种方法,也是以前用的方法 /获得屏幕大小Dimension screenSize = ...

  7. mysql 存在该记录则更新，不存在则插入记录的sql

    转 http://www.cnblogs.com/zeroone/articles/2298929.html , ‘yourname') ON DUPLICATE KEY UPDATE auto_na ...

  8. 【Chromium中文文档】沙箱FAQ

    沙箱FAQ 转载请注明出处:https://ahangchen.gitbooks.io/chromium_doc_zh/content/zh//General_Architecture/Sandbox ...

  9. keil MDK编译器(V4.01)与H-JTAG的问题

    前一阵子转投到MDK下面做开发,因为公司以前都用h-jtag做下载仿真工具,用的h-jtag版本为V0.9,我拿以前在ads1.2中编译成功的程序,稍作修改,在mdk下编译成功,仿真也没有问题,但下载 ...

  10. CC++初学者编程教程(5) 安装codeblocks软件开发环境

    Code::Blocks 是一个开放源码的全功能的跨平台C/C++集成开发环境. Code::Blocks是开放源码软件.Code::Blocks由纯粹的C++语言开发完成,它使用了蓍名的图形界面库w ...