jQuery $.ajax 和 jQuery UI 对话框:未捕获的 TypeError:非法调用?

Posted

技术标签:

【中文标题】jQuery $.ajax 和 jQuery UI 对话框:未捕获的 TypeError:非法调用?【英文标题】:jQuery $.ajax and jQuery UI dialog: Uncaught TypeError: Illegal invocation? 【发布时间】:2017-11-03 20:13:58 【问题描述】:

当我单击 jQuery UI 对话框 Save 按钮时,我正在尝试发送 AJAX 请求,我就是这样做的:

$(function () 
    var comment_dlg = $('#add_comment_dialog');
    var quote_id = $('#comment_quote_id');

    $('#order_push').click(function () 
        quote_id.val($(this).data('id'));
        comment_dlg.dialog('open');
    );

    comment_dlg.dialog(
        title: "Write a comment",
        autoOpen: false,
        modal: true,
        width: 600,
        height: 300,
        buttons: 
            Cancel: function () 
                $(this).dialog('close');
            ,
            'Save': function () 
                $.ajax(
                    url: Routing.generate('push_order_xml'),
                    method: 'GET',
                    data:  quote_id: quote_id ,
                    cache: false
                ).done(function (data, textStatus, jqXHR) 
                    if (data.success.length) 
                        alert(data.success);
                     else 
                        alert('Something went wrong!');
                    
                );
            
        
    );
);

但我收到此错误:

未捕获的类型错误:非法调用

我不确定问题出在哪里。我已经检查了 jQuery UI Dialog 和 jQuery $.ajax 文档几次,我的代码似乎是正确的。

有什么想法吗?

【问题讨论】:

【参考方案1】:

好的,最后感谢this answer,我知道问题出在哪里了。

首先,因为这个:

var quote_id = $('#comment_quote_id')

quote_id 的值是整个 html,而不是我预期的值。

其次,我在这里为$('#comment_quote_id') 赋值:

quote_id.val($(this).data('id'));

这是正确的。

第三,我的错误是在这里使用quote_id

data:  quote_id: quote_id 

这又是错误的,因为是整个 HTML 而不是值本身。

解决方法,使用quote_id.val() 例:

data:  quote_id: quote_id.val() 

我不能使用processData: false,因为我不想传递 HTML,而是传递值。

【讨论】:

以上是关于jQuery $.ajax 和 jQuery UI 对话框:未捕获的 TypeError:非法调用?的主要内容,如果未能解决你的问题,请参考以下文章

利用 jQuery UI 和 Ajax 创建可定制的 Web 界面

Jquery UI 自动完成和 Ajax 倍数从成功返回

jquery UI 可拖动不适用于 AJAX

jquery ui tabs详解(中文)

Jquery UI和Bootstrap JS冲突使Autocomplete停止工作

jQuery UI 工具提示小部件中的 AJAX 内容