jQuery - 擁有以

開頭的課程獲得所有具有以input開頭的課程的所有div的最佳方式是什麼？換句話說，a和b應該從下面的內容中返回，但不是c。jQuery - 擁有以

<div id="a" class="input1 foo"></div> 
<div id="b" class="foo input2"></div> 
<div id="c" class="xinput3 foo"></div>

的表面的方法，其令人驚訝地被接受here，是做$("div[class^='input']");課程，錯過b，但。當然$("div[class*='input']");會給c帶來誤判。

我能想出了這個畸形

function getAllInputDivs() { 
    return $("div").filter(function (i, currentDiv) { 
     return $.grep($(currentDiv).attr("class").split(" "), function (val) { 
      return val.substr(0, "input".length) === "input"; 
     }).length > 0; 
    }); 
}

有一個更清潔的方式最好？下面是上述

來源

2011-12-20 Adam Rackis

我不認爲類名是類似input1和input2的最佳選擇。如果輸入的唯一性足以以這種方式枚舉，則可以使用ID或名稱，可以使用'$（「[id^= input]」）' – 2011-12-20 17:14:26

@KevinB - 您可能是對的。我不確定這是否有很好的用例。現在這只是一個理論問題，看看是否可以完成。 – 2011-12-20 17:19:33

相似的問題：[jQuery的選擇器目標任何類名稱（的多個存在）以前綴開頭？]（http://stackoverflow.com/questions/4524412/jquery-selector-to-target-any-css-name- ），但我沒有自定義選擇器表達式，所以我很喜歡這個問題的答案:) – BoltClock 2011-12-20 17:41:33

可以在jQuery的

$.expr[':'].hasClassStartingWithInput = function(obj){ 
    return (/\binput/).test(obj.className); 
};

創建自己的表達working fiddle，您可以用

$('div:hasClassStartingWithInput');

一個的jsfiddle例子檢索那些DIV：http://jsfiddle.net/7zFD6/

編輯：你也可以使用一個參數（沒有困難以這種方式

$.expr[':'].hasClassStartingWith = function(el, i, selector) { 
    var re = new RegExp("\\b" + selector[3]); 
    return re.test(el.className); 
}

新實例譯碼功能標識裏面的類名）上http://jsfiddle.net/pMepk/1/

來源

2011-12-20 17:08:04 fcalderan

不應該把'\ b'變成一個'^'來代替嗎？ – Blazemonger 2011-12-20 17:09:29

不，它不。 '^'只會檢查以input開頭的類是否也是類屬性中列出的第一個類。正如他在問題中指定的那樣，他需要有一個和一個例子 – fcalderan 2011-12-20 17:12:08

我認爲'\ b'可能在某些（狹義）情況下失敗，因爲一個類可能包含將被解釋爲字邊界的字符。像'my.input'，這是一個有效的類。 – 2011-12-20 17:13:17

這裏有一種方法......

function getAllInputDivs() { 
    return $("div").filter(function() { 
     return /(?:^|\s)input/.test(this.className); 
    }); 
}

或使其更加靈活.. 。

function classStartsWith(tag, s) { 
    var re = new RegExp('(?:^|\\s)' + s); 
    return $(tag || '*').filter(function() { 
     return re.test(this.className); 
    }); 
}

或者採取indexOf方法，如果你不喜歡的正則表達式...

function classStartsWith(tag, s) { 
    return $(tag || '*').filter(function() { 
     return this.className.indexOf(s)===0 || this.className.indexOf(' ' + s)>-1; 
    }); 
}

雖然你應該知道，但這並沒有測試製表符，只有空格字符，所以它可能會失敗如果使用製表符而不是空格。

回到正則表達式版本，可以通過將搜索到的字符串添加到選擇器中來提高效率。

然後它只測試div的一個子集。

function getAllInputDivs() { 
    return $("div[class*='input']").filter(function() { 
     return /(?:^|\s)input/.test(this.className); 
    }); 
}

隨着應用到只有那些你知道有input某處類的div的.filter()，性能會提高。

還是多才多藝的版本是這樣的：

function classStartsWith(tag, s) { 
    var re = new RegExp('(?:^|\\s)' + s); 
    return $((tag || '*') + '[class*="' + s + '"]').filter(function() { 
     return re.test(this.className); 
    }); 
}

來源

2011-12-20 17:18:26

+1 - 很好 - 它看起來像你在Fabrizio的答案中修正了正則表達式。 – 2011-12-20 17:20:42

這是我對這個問題的解決方案：

var divs = $('div').hasClassStartsWith("my_class_prefix");

它的工作原理也：

(function($) { 
    $.fn.hasClassStartsWith = function(klass) { 
    var _return = []; 
    for(var i = 0; i < this.length; i++){ 
     if((' ' + $(this[i]).attr('class')).indexOf(klass) != -1) 
      _return.push(this[i]); 
    } 
    return _return; 
    } 
})(jQuery);

如下使用它對於這種情況，有人在中間創建一個帶點的課程。

來源

2013-06-24 15:30:17 igasparetto

jQuery - 擁有以

回答

相關問題