Đóng tất cả các hộp thoại đang mở? (JQuery)

Question

Làm cách nào để đóng tất cả các hộp dialog được mở trong jQuery? Tình huống tiếp theo: Tôi có một trang đơn giản không có hộp thoại. Nó có một số nút mở nó sở hữu hộp thoại.

Khi tôi nhấp vào nút, tôi cần đóng tất cả các hộp thoại đã mở.

Dưới đây là HTML:

<div id="buttons"> 
    <a href="#" id="btn_1">Button 1</a> 
    <a href="#" id="btn_2">Button 2</a> 
    <a href="#" id="btn_3">Button 3</a> 
</div> 
<div id="dialog_1" class="dialogbox">...</div> 
<div id="dialog_2" class="dialogbox">...</div> 
<div id="dialog_3" class="dialogbox">...</div> 

Và đây là jQuery:

$(function() { 
    $('#buttons').find('a').click(function() { 
     // close all dialogs 
     $('.dialogbox').dialog("close"); 

     // find out clicked id and open dialog 
     var nr = this.id.split("_")[1]; 
     $('#dialog_'+nr).dialog(); 
    }); 
}); 

Chrome nói: Uncaught Error: cannot call methods on dialog prior initialization; attempted to call method 'close'.

Tôi đã cố gắng kiểm tra $('.dialogbox').dialog('isOpen'), nhưng cùng một kết quả.

Tôi làm cách nào để đóng tất cả các hộp thoại?

Answer 1

Kể từ khi tất cả họ đều thừa hưởng cùng lớp, đây là cách tốt nhất để chọn tất cả và gần gũi bởi:

$(".ui-dialog-content").dialog("close");

Answer 2

Bạn có thể đơn giản cố gắng này là họ đều có lớp .ui-dialog-content, vì vậy chọn bởi đó và đóng chúng lại như sau: -

$(".ui-dialog-content").dialog("close");