zoukankan      html  css  js  c++  java
  • Jquery表单验证

    .代码中添加引用(必备引用)

        <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> <!--jquery必须库-->
        <script src="formValidator1/formValidator-4.0.1.min.js" type="text/javascript"></script> <!--表单验证必须库-->
        <script src="formValidator1/formValidatorRegex.js" type="text/javascript"></script> <!--表单验证扩展库-->
        <link href="formValidator1/style/validator.css" rel="stylesheet" type="text/css" /><!--表单验证样式表-->

    3.<body>中要验证的标签(做一些常用的演示)

    复制代码
    <table border="0px" style="font-size:12px">
      <tr> 
          <td colpan="3"><input type="submit" name="button" id="button" value="提交" /></td>
        </tr>
        <tr> 
          <td align="right">身份证(正则表达式库):</td>
          <td><input name="sfz" type="text" id="sfz" /></td>
          <td><div id="sfzTip" style="300px"></div></td>  <!--必须注意这里提示验证信息中的div的id值,跟要验证控件中的id值多了一个Tip,下面的都是这样。必须多的是Tip,也必须要多。-->
        </tr>
        <tr> 
          <td align="right">身份证(外部函数):</td>
          <td><input type="text" id="sfz1" style="120px" /></td>
          <td><div id="sfz1Tip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">整数:</td>
          <td><input type="text" id="zs" style="120px" /></td>
          <td><div id="zsTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">正整数:</td>
          <td><input type="text" id="zzs" style="120px" /></td>
          <td><div id="zzsTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">负整数:</td>
          <td><input type="text" id="fzs" style="120px" /></td>
          <td><div id="fzsTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">数字:</td>
          <td><input type="text" id="sz" style="120px" /></td>
          <td><div id="szTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">正数(正整数 + 0):</td>
          <td><input type="text" id="zs1" style="120px" /></td>
          <td><div id="zs1Tip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">负数(负整数 + 0):</td>
          <td><input type="text" id="fs" style="120px" /></td>
          <td><div id="fsTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">浮点数:</td>
          <td><input type="text" id="fds" style="120px" /></td>
          <td><div id="fdsTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">正浮点数:</td>
          <td><input type="text" id="zfds" style="120px" /></td>
          <td><div id="zfdsTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">负浮点数:</td>
          <td><input type="text" id="ffds" style="120px" /></td>
          <td><div id="ffdsTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">非负浮点数(正浮点数 + 0):</td>
          <td><input type="text" id="fffds" style="120px" /></td>
          <td><div id="fffdsTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">非正浮点数(负浮点数 + 0):</td>
          <td><input type="text" id="fzfds" style="120px" /></td>
          <td><div id="fzfdsTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">颜色:</td>
          <td><input type="text" id="ys" style="120px" /></td>
          <td><div id="ysTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">你的EMAIL:</td>
          <td><input type="text" id="email" style="120px" /></td>
          <td><div id="emailTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">手机:</td>
          <td><input type="text" id="sj" style="120px" /></td>
          <td><div id="sjTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">邮编:</td>
          <td><input type="text" id="yb" style="120px" /></td>
          <td><div id="ybTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">非空:</td>
          <td><input type="text" id="fk" style="120px" /></td>
          <td><div id="fkTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">图片:</td>
          <td><input type="text" id="tp" style="120px" /></td>
          <td><div id="tpTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">压缩文件:</td>
          <td><input type="text" id="rar" style="120px" /></td>
          <td><div id="rarTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">ip4:</td>
          <td><input type="text" id="ip4" style="120px" /></td>
          <td><div id="ip4Tip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">QQ号码:</td>
          <td><input type="text" id="qq" style="120px" /></td>
          <td><div id="qqTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">国内电话:</td>
          <td><input type="text" id="dh" style="120px" /></td>
          <td><div id="dhTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">用户名:</td>
          <td><input type="text" id="yhm" style="120px" /></td>
          <td><div id="yhmTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">字母:</td>
          <td><input type="text" id="zm" style="120px" /></td>
          <td><div id="zmTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">大写字母:</td>
          <td><input type="text" id="dxzm" style="120px" /></td>
          <td><div id="dxzmTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">小写字母:</td>
          <td><input type="text" id="xxzm" style="120px" /></td>
          <td><div id="xxzmTip" style="300px"></div></td>
        </tr>
        <tr> 
          <td align="right">身份证:</td>
          <td><input type="text" id="sfz" style="120px" /></td>
          <td><div id="sfzTip" style="300px"></div></td>
        </tr>
      </table>
  • 相关阅读:
    linux下tomcat内存溢出
    leetcode
    HDU 4810 Wall Painting (位操作-异或)
    详解Java中的访问控制修饰符(public, protected, default, private)
    mpvue开发微信小程序之时间+日期选择器
    多行文本溢出隐藏
    swift 多态函数方式
    swift 多态函数方式
    swift 多态函数方式
    swift 多态函数方式
  • 原文地址:https://www.cnblogs.com/chouji717/p/6109195.html
Copyright © 2011-2022 走看看