Question

我遇到了多个jQuery UI对话框的问题。我想要的是我可以有多个对话框，点击“.close-modal”类的按钮只会关闭该按钮所在的对话框。现在，首先是一个小背景：我在网站的“主要”父级中有一个简单的功能，它将通过单击“.modal”类的链接打开模式对话框;

在父级

中

function modal( href, title ) {
    var $dialog = $('<div></div>');
    $dialog.html('<iframe class="modal" name="' + title + '" style="border: 0px;" src="' + href + '" width="100%" height="100%"></iframe>');
    $dialog.dialog({
        autoOpen: false,
        modal: true,
        height: 650,
        width: 950,
        title: title
    });


    $dialog.dialog( 'open' );

    $(document).bind( 'close-dialog', function( ) {
        $dialog.dialog( 'close' );
    });
}

$('a.modal').click( function( event ) {
    event.preventDefault( );
    modal( $(this).attr( 'href' ), $(this).attr( 'title' ) );
}

此代码按我希望的方式工作。要从对话框中打开一个对话框，我使用正确的参数调用父窗口的模态函数，以便在父窗口中显示多个对话框：

在对话框中

( function( $ ) {
    $(document).ready( function( ) {
        $('a.modal').click( function( event ) {
            event.preventDefault( );
            parent.modal( $(this).attr( 'href' ), $(this).attr( 'title' ) );
        }

        /** Trigger the close-dialog event on the parent to close the current dialog. */
        $('.close-dialog').click( function( ) {
            parent.jQuery( parent.document ).trigger( 'close-dialog' );
        });
    });
})( jQuery );

所以，实质上;我在父窗口上定义了一个事件（“关闭对话框”），可以通过iframe中的代码调用它来调用$ dialog.dialog（'close'）;这很有效;我可以创建多个对话框，甚至可以在对话框中创建，但问题是，一旦我单击button.close-dialog，它就会关闭所有对话框。

有没有办法确定调用事件的对话框？或者将事件绑定到当前对话框？

Answer 1

您可以使用jquery模式的按钮选项。

<script>
$(function() {
    $( ".myModals" ).dialog({
        modal: true,
        buttons: {
            Close: function() {
                $( this ).dialog( "close" );
            }
        }
    });
});
</script>

这应该一次性完成所有模态，并且它创建的按钮仅适用于自己。希望有所帮助！

一次关闭一个jquery-ui对话框

1 个答案: