自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

JQuery ID選擇器中的不能包含特殊字符的處理

開(kāi)發(fā) 前端
最近在開(kāi)發(fā)一個(gè)界面時(shí)發(fā)現(xiàn)了某些特殊情況下ID選擇器就會(huì)出現(xiàn)無(wú)效的情況,查明是ID選擇器中的不能包含特殊字符的原因。本文將介紹解決方法。

問(wèn)題的起因是動(dòng)態(tài)生成的Dom 元素的ID中包含“=”導(dǎo)致(你可能會(huì)問(wèn)為什么會(huì)在ID中有“=”號(hào),我只能說(shuō)這種情況雖然不多,但是有,比如我的情況,我的ID是某個(gè)字符串Base64編碼之后的字符串)。

JQuery中的1.2.6版本至1.3.2版本都有這種情況,下面是測(cè)試的代碼:

view plaincopy to clipboardprint?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<html xmlns="<head> 
    <title></title> 
    <script src="Javascript/jquery.1.3.2.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
        $(function() {              
            var div = $("#hellodiv=");  
            if (div.length > 0) {  
                alert("獲取到了Div");  
            }  
            else {  
                alert("哎呀ID中不能包含=");  
            }  
            var div2 = document.getElementById("hellodiv=");  
            if (div2) {  
                alert("我可以獲取到哦");  
            }  
            else {  
                alert("哎呀我也獲取不到");  
            }  
        });  
    </script> 
</head> 
<body> 
    <div id="hellodiv="></div> 
</body> 
</html> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<html xmlns="<head>
    <title></title>
    <script src="Javascript/jquery.1.3.2.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function() {           
            var div = $("#hellodiv=");
            if (div.length > 0) {
                alert("獲取到了Div");
            }
            else {
                alert("哎呀ID中不能包含=");
            }
            var div2 = document.getElementById("hellodiv=");
            if (div2) {
                alert("我可以獲取到哦");
            }
            else {
                alert("哎呀我也獲取不到");
            }
        });
    </script>
</head>
<body>
    <div id="hellodiv="></div>
</body>
</html>查看Jquery的源代碼可以看到堆選擇器的解析有這么一段:

view plaincopy to clipboardprint?
var match = quickExpr.exec( selector );  
 
        // Verify a match, and that no context was specified for #id  
        if ( match && (match[1] || !context) ) {  
 
            // HANDLE: $(html) -> $(array)  
            if ( match[1] )  
                selector = jQuery.clean( [ match[1] ], context );  
 
            // HANDLE: $("#id")  
            else {  
                var elem = document.getElementById( match[3] ); 

    var match = quickExpr.exec( selector );

            // Verify a match, and that no context was specified for #id
            if ( match && (match[1] || !context) ) {

                // HANDLE: $(html) -> $(array)
                if ( match[1] )
                    selector = jQuery.clean( [ match[1] ], context );

                // HANDLE: $("#id")
                else {
                    var elem = document.getElementById( match[3] );其中quickExpr是個(gè)正則表達(dá)式對(duì)象

quickExpr = /^[^<]*(<(.|\s)+>)[^>]*$|^#([\w-]+)$/,

^#([\w-]+)$是判斷ID選擇符,很明顯只能匹配包括下劃線的任何英文字符數(shù)字和下劃線中劃線。

所以其他的字符如= @等都會(huì)出現(xiàn)問(wèn)題。你解決的辦法可以修改JQuery代碼中的正則表達(dá)式

如我要添加=號(hào),那么我可以改成quickExpr = /^[^<]*(<(.|\s)+>)[^>]*$|^#([\w-\=]+)$/,

或者避免出現(xiàn)=的ID出現(xiàn)。。隨便,本文只是為了大家遇到類似問(wèn)題時(shí)可以快速找到問(wèn)題。

【編輯推薦】

  1. 使用jQuery和PHP構(gòu)建一個(gè)受Ajax驅(qū)動(dòng)的Web頁(yè)面
  2. 使用 jQuery 簡(jiǎn)化 Ajax 開(kāi)發(fā)
  3. 跟ASP.NET MVC一起使用jQuery
責(zé)任編輯:彭凡 來(lái)源: 博客園
相關(guān)推薦

2012-06-12 09:43:11

jQuery

2010-09-07 12:56:49

id選擇器CSS

2010-12-27 16:01:45

jQuery選擇器

2010-07-20 10:11:32

jQuery選擇器Sizzle

2010-09-26 16:51:03

SQL Server查

2009-07-16 11:02:33

Swing文件選擇器

2013-03-11 10:30:56

CSSWeb

2010-06-25 09:04:43

jQuery選擇器

2013-12-02 14:22:14

jQuery選擇器

2010-09-03 09:30:29

CSS選擇器

2010-08-26 12:53:40

CSSid選擇器

2010-09-06 09:50:34

id選擇器CSS

2011-04-26 15:07:48

jQuery

2009-11-26 09:52:05

jQuery選擇器

2015-07-13 11:28:22

Linux文件名

2023-01-30 08:42:33

CSS選擇器性能

2012-04-16 14:32:31

iOS選擇器代碼

2010-09-07 10:19:31

SQL語(yǔ)句

2025-02-28 09:14:09

JavaNIO機(jī)制

2020-10-25 08:57:56

CSS前端瀏覽器
點(diǎn)贊
收藏

51CTO技術(shù)棧公眾號(hào)