2012-02-29 68 views
1

我玩弄jQuery Isotope和希望實現的元素的搜索。當用戶輸入到一個文本框,我改變濾波器選項是這樣的:如何使用jQuery選擇過濾jQuery的同位素項目不區分大小寫(搜索)

var newFilter = '[data-myAttr*="' + $('#mySearchBox').val() + '"]'; 
$('#myIsotopeContainer').isotope({filter: newFilter}); 

我使用jQuery的attribute contains selector。但它是區分大小寫的,我想成爲中的敏感。我怎樣才能做到這一點?

我看別人的質疑,谷歌搜索結果使用.filter(fn)暗示,但我沒有用同位素那麼多的控制。我只是給它一個選擇器。

+0

但不知道在哪裏myAttr值來自使他們所有的小寫字母和變化的搜索價值小寫似乎很有道理 – charlietfl 2012-02-29 01:55:47

+0

這完全是最簡單的解決方案。發佈它作爲答案,我會至少upvote它。 – 2012-02-29 03:27:41

回答

1

使用較低的情況下,協議的所有屬性,然後更改用戶輸入小寫

3

通過觀察同位素的來源,你應該能夠傳遞一個函數,就像這樣:

$('#myIsotopeContainer').isotope({ filter: function() { 
     // case-insensitive pattern match: 
     var pattern=new RegExp($('#mySearchBox').val(),'i'); 

     // test against 'data-myAttr': 
     return pattern.test(this.attr('data-myAttr')); 
    } 
}); 

同位素只是使一個.filter()調用來完成它自己的過濾。試試看看會發生什麼。

+0

+1爲過濾器添加功能效果很好。我需要根據孩子的屬性進行過濾。 – lucuma 2012-06-14 01:53:14

0

我想給所涉及到這個問題對我這樣的人誰是不同的這樣一點點的答案。我想搜索整個元素(或元素的任何子元素)中的任何文本,而不僅僅是屬性。如果您使用的是:contains選擇器,並且希望它不區分大小寫,那麼您應該按照this bug report中所述擴展JQuery。我張貼下面的代碼方便:

$.extend($.expr[':'], { 
    'containsi': function(elem, i, match, array) 
    { 
    return (elem.textContent || elem.innerText || '').toLowerCase() 
    .indexOf((match[3] || "").toLowerCase()) >= 0; 
    } 
}); 

現在你可以使用JQuery的,就像您有使用:包含(「SomeString」),但現在使用新的擴展:containsi(「SomeString」)