Question

您是否知道为什么在关闭对话框后文档中的按钮不再出现在Firefox 12中？

<html>
    <head>
        <link type="text/css" href="jqueryui/css/smoothness/jquery-ui-1.8.20.custom.css" rel="Stylesheet" />    

        <script type="text/javascript" src="jqueryui/js/jquery-1.7.2.min.js"></script>
        <script type="text/javascript" src="jqueryui/js/jquery-ui-1.8.20.custom.min.js"></script>

        <style></style>

        <script type="text/javascript">
            $(document).ready(function() {
                $("#click").click(function() {
                    $("#dialog").attr("title", "save").text("This is the dialog box!").dialog({
                        buttons: {
                            "OK": function() {
                                $(this).dialog("close");
                            }
                        }
                    });
                });
            });
        </script>
    </head>

    <body>
        <div id="dialog" title="Basic dialog">
            <input type="button" value="click" id="click" />
        </div>
    </body>
</html>

Answer 1

工作演示 http://jsfiddle.net/jyy96/6/

您的按钮位于dialog输入内，因此会丢失。

在对话框div

之外移动提交

Jouery代码

$(document).ready(function() {
    $("#click").click(function() {
        $("#dialog").attr("title", "save").text("This is the dialog box!").dialog({
            buttons: {
                "OK": function() {
                    $(this).dialog("close");
                }
            }
        });
    });
});

<强> HTML

<body>
    <input type="button" value="click" id="click" />
    <div id="dialog" title="Basic dialog"></div>
</body>

Answer 2

对话框中有按钮，对话框关闭后，它得到 CSS给出的内联dialog()：

display: none;
...

如果您需要始终存在该按钮，则该按钮应位于对话框内容之外。

示例HTML

<body> 
    <input type="button" value="click" id="click" /> 
    <div id="dialog" title="Basic dialog"></div> 
</body>

按钮没有显示

2 个答案: