Javascript 在jquery对话框中单击按钮时出错

我可以在单击“拒绝请求”时显示对话框，但对话框不会关闭，并且在单击“取消”或“确定”时在控制台中看到错误。“未捕获的TypeError:无法读取未定义的属性'apply'”

HTML:

拒绝请求
拒绝请求？

JQuery：

<script type="text/javascript">
    $(document).ready(function () {
       $("#reject-dialog").dialog({
            autoOpen: false,
            modal: true,                    
            buttons: {
                "Confirm": {
                    text: "OK",
                    id: "confirm-reject"
                },
                "Cancel": {
                    text: "Cancel",
                    id: "cancel-reject"
                }
            }
       });
       $("#btn-reject").click(function (e) {
           e.preventDefault();

           $("#reject-dialog").dialog('open');
       });
       $('#cancel-reject').click(function () {
           $("#reject-dialog").dialog('close');
           console.log('confirm');
       });
       $('#confirm-reject').click(function () {
           $("#reject-dialog").dialog('close');
           console.log('reject');
       });
});  //dom

</script>

$（文档）.ready（函数（）{
$（“#拒绝对话框”）。对话框({
自动打开：错误，
莫代尔：是的，
按钮：{
“确认”：{
文字：“OK”，
id:“确认拒绝”
},
“取消”：{
文本：“取消”，
id:“取消拒绝”
}
}
});
$（“#btn拒绝”）。单击（功能（e）{
e、 预防默认值（）；
$（“#拒绝对话框”）.dialog（'open'）；
});
$（“#取消拒绝”）。单击（函数（）{
$（“#拒绝对话框”）.dialog（'close'）；
console.log（'confirm'）；
});
$（“#确认拒绝”）。单击（函数（）{
$（“#拒绝对话框”）.dialog（'close'）；
console.log（“拒绝”）；
});
});  //多姆

JQuery版本：

---

您正在绑定到

文档中尚不存在的按钮。准备就绪

相反，您可以在创建按钮时告诉对话框要触发什么回调

更新： 根据Jquery ui文档，接受以下两种格式中的一种：

1） 对象：键是按钮标签，值是单击关联按钮时的回调

2） 数组：数组的每个元素都必须是一个对象，定义要在按钮上设置的属性、属性和事件处理程序

我更新了代码以反映这一点

代码

$（文档）.ready（函数（）{
var dialogDiv=$（“#拒绝对话框”）；
dialogDiv.dialog({
自动打开：错误，
莫代尔：是的，
按钮：[
{
文字：“OK”，
id:“确认拒绝”，
单击：函数（）{
dialogDiv.dialog（“关闭”）；
console.log（'confirm'）；
}
},
{
文本：“取消”，
id:“取消拒绝”，
单击：函数（）{
dialogDiv.dialog（“关闭”）；
console.log（“拒绝”）；
}
}
]
});
$（“#btn拒绝”）。单击（功能（e）{
e、 预防默认值（）；
dialogDiv.dialog（“打开”）；
});
});  //多姆

您需要使用，因为执行代码时按钮不存在

例如，更改：

$('#cancel-reject').click(function () {
    $("#reject-dialog").dialog('close');
    console.log('confirm');
});

致：

---

理想情况下，您希望绑定到页面上已存在的元素，该元素比

文档

更接近，以获得更好的性能。

您需要通知单击函数，甚至需要在创建对话框后绑定单击处理程序。我认为这是因为Jquery试图通过apply native js函数执行属性click，如果您没有定义它，js会尝试在未定义的函数中执行apply

因此，我建议您定义一个空函数（或jQuery.noop）：

---

需要更多的代码，因为在您的代码中没有apply被调用，所以必须有更多的代码，但它看起来像任何其他脚本调用jquery的apply函数，在任何地方，jquery都没有定义。我认为在兼容模式下使用jquery是很重要的，并且它没有设置。这消除了错误，现在我看到了控制台日志消息（拒绝或确认），但对话框没有关闭。嗯。现在它正在跳过preventDefault并提交表单。没有打开任何对话框。哦，这是有意义的。preventDefault现在正在触发，我看到了与我单击的对话框按钮关联的控制台日志消息…但那该死的对话框没有关闭！另外，你能解释分配的方法吗var的对话框id？您可以忽略var分配，这只是旧习惯。它允许您更改对话框id，而无需更改太多代码。我没有收到任何错误，而且除了css中的样式之外，我没有任何其他内容。这可能是jquery的版本吗？我将更新我的问题以显示如何调用jquery。我得到控制台日志消息现在是，但是对话框没有关闭，我仍然在控制台消息确认或拒绝之前看到错误“UncaughtTypeError:cannotreadproperty'apply'of undefined”。

<script type="text/javascript">
$(document).ready(function () {
   var dialogDiv = $("#reject-dialog");
   dialogDiv.dialog({
        autoOpen: false,
        modal: true,                    
        buttons: [
            {
                text: "OK",
                id: "confirm-reject",
                click: function() {
                    dialogDiv.dialog("close");
                      console.log('confirm');
                }
            },
            {
                text: "Cancel",
                id: "cancel-reject",
                click: function(){
                    dialogDiv.dialog("close");
                    console.log('reject');
                }
            }
       ]
   });
   $("#btn-reject").click(function (e) {
       e.preventDefault();

       dialogDiv.dialog('open');
   });
});  //dom

</script>

$('#cancel-reject').click(function () {
    $("#reject-dialog").dialog('close');
    console.log('confirm');
});

$(document).on('click','#cancel-reject', function () {
    $("#reject-dialog").dialog('close');
    console.log('confirm');
});

"Confirm": {
    text: "OK",
    id: "confirm-reject",
    click: function(){} // or jQuery.noop()
}