Làm thế nào để tìm cha mẹ với một lớp đã biết trong jQuery?


242

Tôi có một <div>cái có nhiều <div>s khác trong đó, mỗi cái ở một cấp độ lồng khác nhau. Thay vì cung cấp cho mỗi đứa trẻ <div>một định danh, tôi chỉ cần cung cấp cho <div>các định danh gốc . Đây là một ví dụ:

<div class="a" id="a5">
  <div class="b">
    <div class="c">
      <a class="d">
      </a>
    </div>
  </div>
</div>

Nếu tôi viết một hàm trong jQuery để trả lời lớp dvà tôi muốn tìm ID cho lớp cha, lớp của nó, atôi sẽ làm điều này như thế nào?

Tôi không thể đơn giản làm được $('.a').attr('id');, vì có nhiều lớp as. Tôi có thể tìm thấy ID cha mẹ của cha mẹ của nó nhưng có vẻ như thiết kế kém, chậm và không đa hình (tôi sẽ phải viết mã khác để tìm ID cho lớp c).

Câu trả lời:


488

Giả sử đó this.d, bạn có thể viết

$(this).closest('.a');

Các closestphương pháp trả về cha mẹ trong cùng của nguyên tố của bạn phù hợp với selector.


47
Lưu ý rằng có một chút bắt: Nếu phần tử bắt đầu của bạn khớp với truy vấn quá, bạn không nhận được phần tử cha mà thay vào đó là phần tử tương tự. Điều này có thể hoặc không thể hành vi muốn. Nếu không, tôi khuyên bạn nên: $ (this) .parent (). Gần nhất ('. A');
Risord

1
Rất hữu ích. Tôi luôn luôn sử dụng để làm $ (this) .parent (). Parent (). Parent () và tôi biết có một giải pháp tốt hơn.
Wang'l Pakhrin

28

Truyền một bộ chọn cho hàm cha mẹ jQuery :

d.parents('.a').attr('id')

EDIT Hmm, thực sự câu trả lời của Slaks là vượt trội nếu bạn chỉ muốn tổ tiên gần nhất phù hợp với bộ chọn của bạn.


8

Bạn có thể sử dụng cha mẹ () để nhận tất cả các bậc cha mẹ với bộ chọn đã cho.

Mô tả: Lấy tổ tiên của từng thành phần trong bộ phần tử phù hợp hiện tại, được lọc tùy chọn bởi bộ chọn.

Nhưng cha mẹ () sẽ chỉ nhận cha mẹ đầu tiên của phần tử.

Mô tả: Lấy cha mẹ của từng phần tử trong tập hợp các phần tử phù hợp hiện tại, được lọc tùy chọn bởi bộ chọn.

jQuery cha mẹ () so với cha mẹ ()

Và có .parentsUntil () mà tôi nghĩ sẽ là tốt nhất.

Mô tả: Lấy tổ tiên của từng thành phần trong tập hợp các phần tử phù hợp hiện tại, tối đa nhưng không bao gồm phần tử được khớp bởi bộ chọn.


Anh ta chỉ muốn một phụ huynh duy nhất , vì vậy anh ta nên gọi closest.
SLaks 17/03/2016

2

Sử dụng .parentsUntil ()

$(".d").parentsUntil(".a");

Điều đó sẽ nhắm mục tiêu mọi phần tử cha cho đến khi đạt đến phần tử cha phù hợp.
Dustin Halstead

0

Trích từ ý kiến ​​của @ Resord ở trên. Điều này làm việc cho tôi và nghiêng hơn với câu hỏi.

$(this).parent().closest('.a');

Cảm ơn

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.