AJAX使用jQuery-语法错误

AJAX using jQuery - Syntax Error?

本文关键字：错误 语法 jQuery- 使用 AJAX      更新时间：2023-09-26

以下是HTML，其中包含对负责发出AJAX调用的JavaScript函数的调用。我知道锚标记不应该有value属性，但我将它与jQuery的.attr("value"(方法一起使用。

<a href="javascript:;" onclick="ajaxTest();" title="Execute AJAX" value="executeAJAX">Execute AJAX</a>

以下是JavaScript函数。如果它有任何意义，那么它本身就包含在一个.js文件中。

function ajaxTest() {
    $.ajax({
        type: "POST",
        url: "doAJAX",
        data: {"selectedScope": "5",
               "selectedView": "6"},
        dataType: "text",
        success: function(responseData) {
            $("#replaceThis").append(responseData);
        }
    });
}

每次单击链接时，Firefox的web控制台中都会显示一条"语法错误"消息。然而，JavaScript似乎按预期工作

我只是想了解我为什么会出错。

我应该补充一点，我使用的是jQuery 1.7.1。

我进行了一次搜索，找到的唯一解决方案是"data"选项的键应该用双引号括起来，所以我已经实现了，但我仍在了解语法。

谢谢。

编辑：

查看Firebug控制台，上面的代码不会触发错误就像在Firefox控制台中一样，但是，我看到了以下内容在POST请求的XML部分：

XML解析错误：语法错误位置：moz null主体：｛1d13df07-25fb-4058-9f82-ce1bef3c8949｝行号1，第1列：
alskdfjlaksjdfjasdfl
^

"alskdfjlaksjdfjasdfl"只是我在测试这些东西时设置servlet返回的内容。

这有点奇怪，因为jQuery似乎正在尝试解析响应是XML，尽管我已经明确表示它是文本。

我最近遇到了同样的问题。jQuery似乎正确地处理了数据和dataType，但实际上是Firefox返回了语法错误，这解释了为什么您的代码按预期执行，但仍向控制台打印错误。

如果您查看开发人员控制台，您可以看到Firefox正在将纯文本数据解释为另一种格式(可能是XML(。Firefox厌倦了将数据解析为XML，但不能，因为它不是有效的XML，这导致"语法错误"被打印到控制台。

对我来说，这个问题的解决方案是编辑服务器，所以它返回了以下标题：

Content-Type: "text/plain"

这似乎只是Firefox的问题，Chrome没有遇到这个问题。这里有一个Firefox bug，似乎涉及到了这个问题。

function ajaxTest() {
    $.ajax({
        type: "POST",
        url: "doAJAX",
        data: {"selectedScope": "5",
               "selectedView": "6"          <---- here (drop comma, add bracket)
               },
        dataType: "text",
        success: function(responseData) {
            $("#replaceThis").append(responseData);
        }
    });
}

function ajaxTest() {
    $.ajax({
        type: "POST",
        url: "doAJAX",
        data: {
            "selectedScope": "5",
            "selectedView": "6"
        }, // <-- need closing curly brace and comma
        dataType: "text",
        success: function(responseData) {
            $("#replaceThis").append(responseData);
        }
    });
}

编辑

我在jsFiddle上找到了它。

此外，尝试更改

<a href="javascript:;" ...

至

<a href="javascript:void();"...`

编辑2

我也让它以另一种方式工作。(使用Firefox 8.0.1和Jquery 1.7.1(

请在此处查看它的实际操作。

问题出在您的数据对象上，您丢失了一个尾随的

编辑：

不确定这是否是问题所在，但我认为你可以跳过数据对象中键周围的引号(如果你只想发送数字，也可以跳过值周围的引号，例如，如果你想发送字符串，请保留它们(：

编辑2:

根据jQuery文档，.append((需要一个DOM元素、HTML字符串或jQuery对象。因此，我为您的响应创建了一个DOM文本节点，并将其附加，而不仅仅是文本字符串。请注意，编辑是未经测试的。

function ajaxTest() {
    $.ajax({
        type: "POST",
        url: "doAJAX",
        data: {
           selectedScope: 5,
           selectedView: 6
        },
        dataType: "text",
        success: function(responseData) {
            $("#replaceThis").append(document.createTextNode(responseData));
        }
    });
}

这是因为您忘记在data参数上放置}。试试这个：

function ajaxTest() {
    $.ajax({
        type: "POST",
        url: "doAJAX",
        data: {"selectedScope": "5",
               "selectedView": "6"},
        dataType: "text",
        success: function(responseData) {
            $("#replaceThis").append(responseData);
        }
    });
}

一个建议：当你遇到这样的问题时。使用Google闭包编译器服务。它会告诉你问题的确切位置。或者Firebug，如果你使用Firefox。

function ajaxTest() {
    $.ajax({
        type: "POST",
        url: "doAJAX",
        dataType: "html",
        data:{
               "selectedScope": "5",
               "selectedView": "6"
         },
        success: function(responseData) {
            $("#replaceThis").append(responseData);
        }
    });
}
相关文章：