Javascript 为什么我的动态确认框只工作一次？

我曾尝试创建一个自定义确认UI对话框，第一次尝试时该对话框运行良好，第二次尝试运行时，我不再收到我选择的警报，窗口也不会关闭。为什么呢？我在这里做错了什么，我可能忽略了

以下是所讨论的HTML和Javascript：

<input type="button" id="Button" value="Click Me" />

$('#Button').click(function () {
    confirmUI('is OK?', 'confirm', function () {
        alert('click OK');
    }, function () {
        alert('click Cancel');
    });
});


var confirmUI = function (text, title, callbackOkClose, callbackCancelClose) {
    var $dialog = $('<div id="confirm_' + new Date().getTime().toString() + '"></div>');
    $dialog.html('<div>' + title + '</div><div>' + text + '<div style="width:100%;"><input type="button" id="confirmCancel" value="Cancel" style="float:right;" /><input type="button" id="confirmOk" value="OK" style="float:right;margin-right: 10px" /></div></div>');
    $('body').append($dialog);
    var buttonString = '';
    $dialog.jqxWindow({
        minWidth: 300,
        minHeight: 80,
        draggable: true,
        initContent: function () {
            $('#confirmOk').jqxButton({
                template: 'primary'
            });
            $('#confirmCancel').jqxButton({
                template: 'default'
            });
        },
        resizable: false,
        closeButtonAction: 'close',
        isModal: true,
        okButton: $('#confirmOk'),
        cancelButton: $('#confirmCancel')
    });

    $dialog.on('close', function (e) {
        console.log('1');
        if (e.args.dialogResult.OK) { //ok
            if (callbackOkClose) {
                callbackOkClose();
            }
        } else { //cancel or close
            if (callbackCancelClose) {
                callbackCancelClose();
            }
        }
    });
    return $dialog;
};

$（“#按钮”）。单击（函数（）{
confirmUI（'is OK？'，'confirm'，函数（）{
警报（“单击确定”）；
}，函数（）{
警报（“单击取消”）；
});
});
var confirmUI=函数（文本、标题、callbackOkClose、callbackCancelClose）{
变量$dialog=$（''）；
$dialog.html（“”+标题+“”+文本+“”）；
$（'body'）。追加（$dialog）；
var按钮字符串=“”；
$dialog.jqxWindow({
最小宽度：300，
身高：80，
真的，
initContent:function（）{
$（'confirmOk'）.jqxButton({
模板：“主”
});
$（'confirmCancel'）.jqxButton({
模板：“默认”
});
},
可调整大小：false，
CloseButton操作：“关闭”，
伊斯莫达尔：是的，
确定按钮：$（'confirmOk'），
取消按钮：$（“#确认取消”）
});
$dialog.on（'close'，函数（e）{
console.log（'1'）；
如果（e.args.dialogResult.OK）{//OK
如果（callbackOkClose）{
callbackOkClose（）；
}
}否则{//取消或关闭
如果（回调取消关闭）{
callbackCancelClose（）；
}
}
});
返回$dialog；
};

---

这里有一个jsfiddle:

因为每次单击按钮都要创建该对话框，所以像

$（“#confirmOk”）

这样的东西不再是唯一的，并返回第一次单击的按钮的选择器。应在关闭时将其从dom中删除，以便下一个操作正常：

$dialog.on('close', function (e) {
    console.log('1');
    $dialog.remove();

---

因为每次单击按钮都要创建该对话框，所以像

$（“#confirmOk”）

这样的东西不再是唯一的，并返回第一次单击的按钮的选择器。应在关闭时将其从dom中删除，以便下一个操作正常：

$dialog.on('close', function (e) {
    console.log('1');
    $dialog.remove();