2012-11-01 44 views
10

Tôi đã tìm thấy nhiều thứ liên quan trên Stack Overflow nhưng không áp dụng cho trường hợp của tôi.Kiểm tra xem phần tử có chứa phần tử khác trong jQuery

Đó là tất cả trong ví dụ này, tôi cần phải kiểm tra xem một phần tử có chứa một phần tử khác không và nếu có, hãy thêm một thứ gì đó.

$(".bt_repondre").click(function(){ 
    comment = $(this).parent().parent().parent(); 
    //I want to check if comment containa a .comment_full element, if no, append. 
    comment.append('add'); 
}); 

Hy vọng bạn có thể giúp tôi, tôi đã cố gắng rất nhiều điều ...

Trả lời

12

Chỉ cần sử dụng .find() và kiểm tra xem lợi nhuận một phần tử, như thế này:

$(".bt_repondre").click(function(){ 
    comment = $(this).parent().parent().parent(); 
    if (! comment.find('.comment_full').length) { 
     comment.append('add'); 
    } 
}); 
+1

@ Jean-François Bạn thực sự nên xem câu trả lời của Blender! Nó ngắn hơn một chút so với cái này – ksoo

+0

PS: Đừng dùng '.parent(). Parent(). Parent()'. Sử dụng '.closest (".someSelector ")' –

23

Bạn có thể sử dụng .has.length:

if (comment.has('.comment_full').length) { 
    // It has that element 
} 
  • .find sẽ lặp qua tất cả các hậu duệ, nhưng .has sẽ dừng sau khi một hậu duệ phù hợp với bộ chọn đã được tìm thấy. Nó có thể chạy nhanh hơn.

  • .length chỉ kiểm tra xem độ dài của tập hợp các phần tử kết quả có khác không.

0

thử này

comment.has('a.comment_full').length == 0 
+1

Sẽ không cho bạn biết nếu nó _didn't_ chứa các yếu tố khác? – ksoo

1

Hầu hết các câu trả lời là rất lớn, nhưng có một new method called contains(container,contained) (thêm vào trong 1.4) trả về một Boolean! Nó về cơ bản giống như đoạn mã của Blender nhưng có lẽ nhanh hơn, cả để gõ và thực thi.

thực hiện trong mã của bạn, nó sẽ giống như thế này:

$(".bt_repondre").click(function(){ 
    comment = $(this).parent().parent().parent(); 
    if(!$.contains(comment, $('.comment_full')))//same as if(!jQuery.contains(... 
    { 
     comment.append('add'); 
    } 
}); 
7

Hầu hết các câu trả lời là không chính xác. Bạn phải chuyển một nút DOM không phải là phần tử jQuery cho $ .contains hoạt động bình thường trên mỗi https://api.jquery.com/jQuery.contains/. Ví dụ, đây là cách bạn sẽ xác định xem $('#a') có chứa $('#b) hay không.

HTML:

<div id="a"> 
    <div id="b"></div> 
</div> 

JavaScript:

var $a = $('#a'); 
var $b = $('#b'); 
var contains = $.contains($a.get(0), $b.get(0)); 
console.log('contains', contains); 
// outputs `true` 
1

Nếu bạn đang tìm kiếm chúng ta hãy nói bất kỳ yếu tố tr bên trong bảng với id của myTable bạn có thể sử dụng đoạn mã sau :

if($('#productsTableBody tr').length) 
{ 
//... 
} 

Bằng cách này, chúng tôi có thể kiểm tra bảng cỏ có chứa bất kỳ hàng nào.

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