Question

我之前在这个论坛上的qstn是关于动态地将文本动态分配到jquery中的按钮，我在这里得到了解决方案。现在我的问题是，点击该按钮后，我必须打开另一个带有2个按钮的UI对话框。我写了以下代码。我能够打开UI对话框，但按钮没有出现。请帮我改变我的代码。

<html>
    <head>
        <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" /> 
        <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
        <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
    </head>
    <body>
        <div id="selector" title="Pop Up" class = "selector"> <p><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span> Do u want to save the score?</p> </div>
        <script>
        var monthNames = ["January", "February", "March", "April", "May", "June",                    "July", "August", "September", "October", "November", "December"];
        var today = new Date();
        var month = monthNames[today.getMonth()];
        var nextMonth = monthNames[today.getMonth() + 1];

        $(".selector").dialog({buttons: [
                {
                    text: month,
                    click: function() {
                     $("#opener").dialog({modal: true, height: 590, width: 1005 });
                        $(this).dialog("close");
                    }
                },
                {
                    text: nextMonth,
                    click: function() {
                        $(this).dialog('close');
                    }
                }
            ]});

        </script>
        <script>

          $(".opener").dialog({buttons: [
                {
                    text: "ok",
                    click: function() {
                        $(this).dialog("open");
                    }
                },
                {
                    text: "cancel",
                    click: function() {
                        $(this).dialog('open');
                    }
                }
            ]});

    </script>

    <div id="opener" title="Pop Up" class = "opener" width ="100px"> 
    <p><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span>
    Score will be updated</p> </div>


</body>

Answer 1

好吧，你没有在这行代码中指定任何按钮：

$("#opener").dialog({modal: true, height: 590, width: 1005 });

也许你想在没有打开的情况下像这样进行intiliazie：

  // did you mean to select #opener or .opener??
  $("#opener").dialog({buttons: [
        {
            text: "ok",
            click: function() {
                $(this).dialog("open");
            }
        },
        {
            text: "cancel",
            click: function() {
                $(this).dialog('open');
            }
        },
        autoOpen: false
    ]});

然后在另一行中打开它，就像这样：

$("#opener").dialog('open');

单击JQuery中的按钮打开UI对话框

1 个答案: