0

我正在尝试创建一个 jquery 对话框确认框。在下面的情况下，当我单击“单击确认框”时，应该会出现对话框。当用户选择 ok 或 cancel 时，这应该会消失，将有关按下哪个按钮的信息传递给调用函数。

我基本上从一个单独的解决方案中复制粘贴了以下代码，并进行了以下更改：我从另一个函数内部调用 myConfirm - 单击“click for..”时调用的函数。我不只是希望在加载页面时出现对话框（这似乎是我见过的大多数示例的情况）。结果是对话框根本没有出现。此外，如果我确实在脚本中直接调用 myConfirm，那么当我按下按钮时它不会关闭。我试过“关闭”而不是“破坏”

html

<head>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.js"></script>
    <script src="/resources/demos/external/jquery.bgiframe-2.1.2.js"></script>
    <script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
    <link rel="stylesheet" href="/resources/demos/style.css" />
</head>

<a id = "confirm"> click for confirm box</div>

脚本

<script>
function myConfirm(dialogText, okFunc, cancelFunc, dialogTitle) {
        $('<div style="padding: 10px; max-width: 500px; word-wrap: break-word;">' + dialogText + '</div>').dialog({
            draggable: false,
            modal: true,
            resizable: false,
            width: 'auto',
            title: dialogTitle || 'Confirm',
            minHeight: 75,
            buttons: {
                OK: function () {
                    if (typeof (okFunc) == 'function') { setTimeout(okFunc, 50); }
                    $(this).dialog('destroy');
                },
                Cancel: function () {
                    if (typeof (cancelFunc) == 'function') { setTimeout(cancelFunc, 50); }
                    $(this).dialog('destroy');
                }
            }
        });
}

 $('[id=confirm]').click(function () { 
 myConfirm( 'Do you want to delete this record ?',
           function () {
                 alert('You clicked OK');
           },
        function () {
            alert('You clicked Cancel');
        },
        'Confirm Delete'
);

});
</script>
4

2 回答 2

1

我已经用 jsfiddle.net 试过你的代码，它工作正常。

您的错误是您在文档仍在加载时附加了事件处理程序。您必须使用ready()事件等待文档准备就绪。

#此外，您可以通过使用选择器通过 id 选择元素来简化一点：

$(document).ready(function() {
    $('#confirm').click(function () { ...
});

另一件事：为什么在执行 okFunc 和 cancelFunc 时要启动计时器？这应该在没有 setTimeout 的情况下工作：

OK: function () {
                   $(this).dialog('close');
                   if (typeof (okFunc) == 'function') { okFunc(); }
                },
于 2012-11-14T12:10:15.343 回答
0

事实证明，由于另一个脚本，它没有工作，该脚本的这一行包含一个较旧的 js 源：

<script src="http://code.jquery.com/jquery-1.4.4.js"></script>

删除该行使其他事物和对话框都可以工作。

另外，我听从了 curtisk 的建议，这很好，只是不足以解决问题。

于 2012-11-14T12:59:02.747 回答