jQuery: chọn một lớp và id của một phần tử cùng một lúc?


170

Tôi đã có một số liên kết mà tôi muốn chọn lớp và id cùng một lúc.

Điều này là do tôi có 2 hành vi khác nhau. Khi một lớp liên kết có một tên lớp, chúng hành xử theo một cách, khi cùng một nhóm liên kết có tên lớp khác, chúng hành xử khác nhau. Tên lớp được chuyển đổi với jquery.

Vì vậy, tôi phải có thể chọn một lớp AND id liên kết cùng một lúc. Điều này có thể không?

Tôi đã thử:

 $("a .save #country")

không có kết quả

Câu trả lời:


305

Bạn có thể làm:

$("#country.save")...

HOẶC LÀ

$("a#country.save")...

HOẶC LÀ

$("a.save#country")...

như bạn thích.

Vì vậy, có, bạn có thể chỉ định một bộ chọn phải khớp với ID lớp (và có khả năng tên thẻ và bất cứ thứ gì bạn muốn ném vào).


41
Vì vậy, về cơ bản, nó giống như: $ ("# a .b") có nghĩa là phần tử có phần tử bên trong lớp b với id a. $ ("# ab") có nghĩa là phần tử có lớp b và id a. Bí quyết là khoảng cách giữa #a và .b
Bhumi Singhal

13
Phải cẩn thận rằng bạn sử dụng bộ chọn id trước lớp nếu không nó không hoạt động. Ví dụ: $ (". Save # country") ... không trả về kết quả.
slotomo

43

Chỉ cần thêm rằng câu trả lời mà Alex cung cấp có hiệu quả với tôi, và không phải câu trả lời được làm nổi bật như một câu trả lời.

Cái này không làm việc cho tôi

$('#country.save') 

Nhưng điều này đã làm:

$('#country .save') 

vì vậy kết luận của tôi là sử dụng không gian. Bây giờ tôi không biết liệu đây có phải là phiên bản jQuery mới mà tôi đang sử dụng (1.5.1) hay không, nhưng dù sao cũng hy vọng điều này sẽ giúp ích cho bất kỳ ai có vấn đề tương tự mà tôi gặp phải.

chỉnh sửa: Tín dụng đầy đủ để giải thích (trong phần bình luận cho câu trả lời của Alex) gửi tới Felix Kling, người nói:

Không gian là bộ chọn hậu duệ, tức là AB có nghĩa là "Khớp tất cả các phần tử khớp với B là hậu duệ của các phần tử khớp với A". AB có nghĩa là "chọn tất cả các yếu tố phù hợp với A và B". Vì vậy, nó thực sự phụ thuộc vào những gì bạn muốn đạt được. #country.save#country .savekhông tương đương.


2
Là vấn đề mà bạn nói "phản biện" thay vì "quốc gia"?
amindfv

8

Nó sẽ hoạt động khi thêm không gian giữa id và định danh lớp

$("#countery .save")...


1
thực sự điều này hiệu quả với tôi, vì nó không hoạt động như $ ('# countery.save') nên cảm ơn bạn!
Nikola

1
Đôi khi tôi thấy nó rất kén chọn không gian. như $ (. selector> .item # id) hoạt động, nhưng $ (. selector> .item #id) thì không.
Abe Petrillo

21
Không gian là bộ chọn hậu duệ , nghĩa A Blà "Khớp tất cả các phần tử khớp với B là hậu duệ của các phần tử khớp với A". ABcó nghĩa là "chọn tất cả các yếu tố phù hợp với A và B". Vì vậy, nó thực sự phụ thuộc vào những gì bạn muốn đạt được. #countery.save#countery .savekhông tương đương.
Felix Kling

2

Cuối cùng, các quy tắc tương tự như đối với css áp dụng.

Vì vậy, tôi nghĩ rằng tài liệu tham khảo này có thể được sử dụng có giá trị.


Bạn có thể tóm tắt nội dung tài liệu tham khảo của bạn?
krlmlr

Trên thực tế, theo api.jquery.com/carget/selector jQuery có một số bộ chọn của riêng nó; Ngoài ra, thực tế không nói rằng tất cả các bộ chọn CSS 1-3 đều được hỗ trợ ...
SamB

@SamB Bạn nói đúng, nhưng nó nói rằng nó mượn từ CSS 1-3 VÀ thêm chính nó. Tôi vẫn nghĩ rằng liên kết đến công cụ W3C là hợp lệ cho cuộc thảo luận này.
akousmata


Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.