2010-06-21 35 views
21

Tôi đã có một số yếu tố với id độc đáo như vậy:Tìm tất cả các yếu tố dựa trên id sử dụng regex trên jQuery selector

<div id='item-1-top'></div> 
<div id='item-2-top'></div> 
<div id='item-3-top'></div> 

Tôi đã hy vọng rằng đây sẽ làm việc sử dụng jQuery:

$("#item-[.]+-top").each(function() { 
    $(this).hide(); 
}); 

Tôi không nắm bắt được các biểu thức chính quy và tôi sẽ đánh giá cao một số đầu vào, như trên dường như không chính xác.

Trả lời

34

Nếu bạn đã làm điều này với regex, khái niệm sẽ chỉ đơn giản là:

item-\d-top 

Trường hợp \d chỉ ra bất kỳ chữ số duy nhất (0..9), và các nhân vật khác không có ý nghĩa đặc biệt (vì vậy được coi là chữ). Tuy nhiên, jQuery hiện không có bộ lọc regex (chỉ những thứ như bắt đầu/kết thúc/chứa/etc) - vì vậy bạn sẽ phải tạo một bộ lọc của riêng bạn (có thể, nhưng nếu bạn đang cân nhắc rằng bạn nên dừng lại và xem xét những gì/lý do tại sao bạn đang lọc và tìm ra nếu có một cách tốt hơn đầu tiên).

Đơn giản hơn nhiều là tạo một lớp (như serg555 gợi ý), vì đó chính là cách bạn xử lý các mục này.

Hoặc (nếu bạn không thể thay đổi đánh dấu để thêm lớp) sau đó sử dụng các bộ lọc hiện có, mở rộng trên g.d.d.c's answer, tôi có thể làm:

$('div[id^=item-][id$=-top]').hide() 

(Vì bạn có thể có nhiều mục kết thúc với chỉ 'top', hoặc là ngay bây giờ hoặc trong tương lai, vì vậy bạn cần phải cụ thể hơn để tránh vô tình che giấu những thứ khác.)

+0

Cảm ơn Peter/serg555. Tôi đã thử ở trên, ví dụ: và nó đã làm việc một điều trị. Đó là một trường hợp tò mò nhưng như serg555 gợi ý, việc sử dụng một lớp học sẽ đơn giản hơn nhiều. Cảm ơn bạn lần nữa! –

+0

mục- \ d-top không hoạt động. – podarok

+4

"không hoạt động" không hoạt động. –

6

Tôi sẽ chỉ định một số lớp học cho họ như item và sau đó thực hiện tìm kiếm theo lớp này $(".item").

8

Nếu id được một cái gì đó giống như news-top-1, news-top-2, news-top-3, news-top-4 vv sau đó các selectors sẽ giúp bạn.

http://api.jquery.com/attribute-starts-with-selector/

$.each($("input[name^='news-top-']"), function() { 
    alert($(this).hide()); 
}); 
3

James Padolsey tạo ra một tuyệt vời filter cho phép regex để được sử dụng để lựa chọn.

jQuery.expr[':'].regex = function(elem, index, match) { 
    var matchParams = match[3].split(','), 
     validLabels = /^(data|css):/, 
     attr = { 
      method: matchParams[0].match(validLabels) ? 
         matchParams[0].split(':')[0] : 'attr', 
      property: matchParams.shift().replace(validLabels,'') 
     }, 
     regexFlags = 'ig', 
     regex = new RegExp(matchParams.join('').replace(/^s+|s+$/g,''), regexFlags); 
    return regex.test(jQuery(elem)[attr.method](attr.property)); 
} 

Bây giờ bạn có thể sử dụng

$('div:regex(id,item-[0-9]-top)').hide() 
0

Hit một vấn đề tương tự và thích/câu trả lời upvoted SERG của tạo lớp thay vì nhưng sau đó vì tôi đang làm nhiều hoạt động trên các yếu tố như vậy, Keyed Collections là phù hợp hơn.

Các vấn đề liên quan