快捷導(dǎo)航

jQuery正則表達(dá)式的使用方法步驟詳解

更新時(shí)間：2016年12月28日 13:57:19 投稿：mrr

本文主要和大家分享的就是jQuery學(xué)習(xí)中正則的使用，正則在jquery里面并沒有比JavaScript多哪些知識(shí)，基本上是一樣的，只是選擇器更好了一點(diǎn)，一起來看看吧

本文主要和大家分享的就是jQuery學(xué)習(xí)中正則的使用，正則在jquery里面并沒有比JavaScript多哪些知識(shí)，基本上是一樣的，只是選擇器更好了一點(diǎn)，一起來看看吧。

基礎(chǔ)正則

1、正則表達(dá)式的創(chuàng)建

a) var checkNum = /^[A-Za-z0-9]+$/;
b) var re=new RegExp(“["+s1+"]“,”g”);

2、常用規(guī)則

a) 用戶密碼：/^[a-zA-Z][a-zA-Z0-9_]{5,20}$/
b) 郵件:/^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/
c) 手機(jī):/^[\d]{5,20}$/
d) 其它常用驗(yàn)證:請(qǐng)百度

3、方式：test

案例

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>jquery ajax</title>
  <script type="text/javascript" src="public/js/jquery-2.2.3.min.js"></script>
</head>
<body>
<form action="">
  <label>用戶名：</label><span id="check_username">檢測</span>
  <input type="text" id="t_username" placeholder="請(qǐng)輸入"/>
  <hr/>
  <label>郵箱：</label><span id="check_email">檢測</span>
  <input type="text" id="t_email" placeholder="請(qǐng)輸入"/>
  <hr/>
  <label>手機(jī)：</label><span id="check_phone">檢測</span>
  <input type="text" id="t_phone" placeholder="請(qǐng)輸入"/>
  <hr/>
</form>
</body>
<script>
  $(function () {
    // 用戶名
    $("#check_username").click(function(){
      var str = $("#t_username").val();
      var ret = /^[a-zA-Z][a-zA-Z0-9_]{5,20}$/;
      if(ret.test(str)){
        alert('ok');
      }else{
        alert('wrong');
      }
    });
    // 郵件
    $("#check_email").click(function(){
      var str = $("#t_email").val();
      var ret = /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/;
      if(ret.test(str)){
        alert('ok');
      }else{
        alert('wrong');
      }
    });
    // 手機(jī)
    $("#check_phone").click(function(){
      var str = $("#t_phone").val();
      var ret = /^[\d]{5,20}$/;
      if(ret.test(str)){
        alert('ok');
      }else{
        alert('wrong');
      }
    });
  });
</script>
</html>

效果演示圖