jquery常用正则表达式语法与实例

2016-02-22    编辑:kp12345     点击(

quickexpr = /^(?:[^<]*(<[ww]+>)[^>]*$|#([w-]+)$)/
(?:…)表示是一个非捕获型

[^<]表示是以"<"起始,包含0个或多个'<'括号

(<[ww]+>)表示是一个捕获型,以'<>'起始,中间包含一个或多个字符

$表示字符的结尾

(#([w-]+))表示是一个捕获型,以'#'号和字符串、数字、_以及-组成

rnotwhite = /s/
s表示是空白字符以外的符号

trimleft = /^s+/trimright = /s+$/  www.111cn.net
左右边的空白。s是空白字符。^前缀表示字符串开始,$后缀表示字符串结束

rdigit = /d/
表示是数字

rsingletag = /^<(w+)s*/?>(?:</1>)?$/
^<(w+)s*/?>
表示以'<'起始,包含一个到多个字符,以及0个到多个空白,0个或者一个'/'和'>'结束,

(?:</1>)?$


看一些常用的jquery正则表达式实例

<script type="text/网页特效" language="javascript" >   
    function validata(){   
        if($("#username").val()==""){   
            document.write("请输入名字");               
            return false;   
        }   
        if($("#password").val()==""){   
            document.write("请输入密码");   
            return false;   
        }          
        if($("#telephone").val()==""){   
            document.write("请输入电话号码");   
        }   
        if($("#email").val()==""){   
            $("#email").val("shuangping@163.com");   
        }   
    }      
       
    function isinteger(obj){   
           
        reg=/^[-+]?d+$/;    
        if(!reg.test(obj)){   
            $("#test").html("<b>please input correct figures</b>");   
        }else{   
            $("#test").html("");   
        }   
    }   
    function isemail(obj){   
        reg=/^w{3,}@w+(.w+)+$/;   
        if(!reg.test(obj)){        
            $("#test").html("<b>请输入正确的邮箱地址</b>");   
        }else{   
            $("#test").html("");   
        }   
    }   
    function isstring(obj){   
        reg=/^[a-z,a-z]+$/;   
        if(!reg.test(obj)){   
            $("#test").html("<b>只能输入字符</b>");   
        }else{   
            $("#test").html("");   
        }   
    }   
    function istelephone(obj){   
        reg=/^(d{3,4}-)?[1-9]d{6,7}$/;   
        if(!reg.test(obj)){   
            $("#test").html("<b>请输入正确的电话号码!</b>");   
        }else{   
            $("#test").html("");   
        }   
    }   
    function ismobile(obj){   
        reg=/^(+d{2,3}-)?d{11}$/;   
        if(!reg.test(obj)){   
            $("#test").html("请输入正确移动电话");   
        }else{   
            $("#test").html("");   
        }   
    }   
    function isuri(obj){   
        reg=/^http://[a-za-z0-9]+.[a-za-z0-9]+[/=?%-&_~`@[]':+!]*([^<>""])*$/;   
        if(!reg.test(obj)){   
            $("#test").html($("#uri").val()+"请输入正确的inernet地址");   
        }else{   
            $("#test").html("");   
        }   
    }   
       
    //document加载完毕执行   
    $(document).ready(function() {   
    // do something here   
       
    //隔行换色功能   
    $("p").each(function(i){   
        this.style.color=['red','green','blue','black'][i%2]   
        });   
       
    //eq(2)获取$("p")集合的第3个元素    
    $("p").eq(2).click(function(){$("#display").css教程("color","blue")});   
       
    //所有test中的p都附加了样式"over"。   
    $("#test>p").addclass("over");   
       
    //test中的最后一个p附加了样式"out"。   
    $("#test p:last").addclass("out");   
       
    //选择同级元素还没看懂   
    //$('#faq').find('dd').hide().end().find('dt').click(function()    
       
    //选择父级元素   
    $("a").hover(   
                function(){$(this).parents("p").addclass("out")},   
                function(){$(this).parents("p").removeclass("out")})   
       
       
    //hover鼠标悬停效果,toggle每次点击时切换要调用的函数  ,   
    //trigger(eventtype): 在每一个匹配的元素上触发某类事件,   
    //bind(eventtype,fn),unbind(eventtype): 事件的绑定与反绑定从每一个匹配的元素中(添加)删除绑定的事件。   
  
    //方法的连写   
    $("#display").hover(function(){   
            $(this).addclass("over");   
        },function(){   
            $(this).removeclass("over");    
        })   
        .click(function(){alert($("#display").text())});   
           
       
       
       
    if($.browser.msie){//判断浏览器,若是ie则执行下面的功能   
           
        //聚焦   
        $("input[@type=text],textarea,input[@type=password]")   
        .focus(function(){$(this).css({background:"white",border:"1px solid blue"})})   
        //也可以这样连着写,   
        //.blur(function(){$(this).css({background:"white",border:"1px solid black"})})   
           
        //失去焦点   
        //css样式可以通过addclass()来添加   
        $("input[@type=text],textarea,input[@type=password]")   
        .blur(function(){$(this).css({background:"white",border:"1px solid black"});});   
    }   
       
    });   


       
html代码

<div id="display">demo</div>   
<div id="test">   
    <p>adfa<a>dfasfa</a>sdfasdf</p>   
    <p>adfadfasfasdfasdf</p>   
    <p>adfadfasfasdfasdf</p>       
    <p>adfadfasfasdfasdf</p>   
</div>   
<form id="theform">   
    isstring<div><input type="text" id="username" onblur="isstring(this.value)"/></div>   
    isinteger<div><input type="text" id="password" onblur="isinteger(this.value)"/></div>   
    istelephone<div><input type="text" id="telephone" onblur="istelephone(this.value)"/></div>   
    ismobile<div><input type="text" id="mobile" onblur="ismobile(this.value)"/></div>   
    isemail<div><input type="text" id="email" onblur="isemail(this.value)"/></div>   
    isuri<div><input type="text" id="uri" onblur="isuri(this.value)"/></div>   
    <div><input type="button" value="validata" onclick="return validata();"  /></div>   
</form>