-1

我想使用 JQUERY UI，但我遇到了问题。我想在对话框中选择按钮，然后在我的页面中执行某些操作。这些是我用来生成对话框的代码：

<script type="text/javascript">
        $(function(){

            // Dialog
            $('#dialog').dialog({
                resizable: false,
                autoOpen: false,
                width: 300,
                height: 140,
                modal: true,
                buttons: {
                    "Ok": function() {
                        $(this).dialog("close");
                    },
                    "Cancel": function() {
                        $(this).dialog("close");
                    }
                }
            });

            // Dialog Link
            $('#dialog_link').click(function(){
                $('#dialog').dialog('open');
                return false;
            });

        });
    </script>
<body>
    <a href="#" id="dialog_link">Open Dialog</a>
    <!-- ui-dialog -->
    <div id="dialog" title="Dialog Title">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit</p>
    </div>
</body>
4

2 回答 2

2

您可以在每一$(this).dialog("close");行之后调用与按钮相关的函数。您有两次对话框关闭行，每个按钮一次，因此每个按钮都可以跟随不同的函数调用。

于 2012-05-09T20:03:37.777 回答
-1

好吧，jQuery 负责知道你按下了什么按钮，基本上。因此，在创建对话框期间，您可以指定对每个按钮的单击事件执行的操作。

您可以调用特定函数或直接编写代码行，如下所示：

buttons: {
    "Ok": function() {
        $(this).dialog("close");
        console.log("Inline code example");
        myOkFunction();
    },
    "Cancel": function() {
        $(this).dialog("close");
        myCancelFunction();
    }
}

function myOkFunction(){
    //Something that will happen on "Ok" button clicked.
}

function myCancelFunction(){
    //Something that will happen on "Cancel" button clicked.
}

但是，您可以在执行期间通过调用小部件选项来更改要执行的代码，如下所示：

$(yourDialog).dialog("option","buttons",{
    "Ok":function(){
        var i = 0; //Inline code example
        this.Dialog("close");
        myNewOkFunction();    
    }
});

但是请注意，这将覆盖对话框中的所有按钮，因此如果您有多个按钮，则需要全部重新编写。

于 2014-03-19T13:32:26.480 回答