jQuery 中的 $.Ajax 数据类型

JavaScript 1年前 105

jQuery ajax 请求中的数据类型是我们期望从服务器获得的数据类型。本教程描述了 jQuery ajax 中数据类型的使用。

jQuery 中的 Ajax 数据类型

ajax 请求中的数据类型是指我们期望从服务器获得的数据类型。如果没有指定数据，jQuery 将根据响应的 MIME 类型进行设置。

通常，数据是纯文本、HTML 或 JSON。下面给出了一个带有数据类型的简单 ajax 请求。

$.ajax({
type : "POST",
url : user,
datatype : "application/json",
contentType: "text/plain",
success : function(employee_data) {
//some code here
},
error : function(error) {
//some error error here
},

在上述请求中，我们期望服务器提供的数据类型是 JSON。数据类型的类型始终是字符串。

ajax 请求的可用数据类型有：

XML 将返回一个可由 jQuery 处理的文档的 XML 文件。
HTML 将返回 HTML 作为纯文本，其中脚本标签在插入 DOM 时被评估。
script 会将响应评估为 JavaScript 并将其作为纯文本返回。我们需要使用带有 URL 的查询字符串参数 =[TIMESTAMP] 禁用缓存，直到缓存选项为真，并且此方法会将 POST 请求转换为远程域请求的 GET。
JSON 会将响应评估为 JSON 并返回一个 JavaScript 对象。跨域 JSON 请求将被转换为 jsonp，除非它在请求选项中包含 jsonp : false。
JSON 数据将被严格解析；任何有故障的 JSON 都将被拒绝，并抛出错误。在较新版本的 jQuery 中，空响应也会被拒绝。
jsonp 将使用 JSONP 加载到 JSON 块中。我们可以在 URL 的末尾添加一个额外的 callback 来指定它。
我们还可以通过将 _=[TIMESTAMP] 附加到 URL 来禁用缓存，直到缓存选项为 true。
text 将返回纯文本字符串。

以下示例是使用上述数据类型的一些 ajax 请求。

将 XML 用于 Ajax 请求

用于在自定义 XML 模式中传输数据的 ajax 请求。

$.ajax({
    url: 'http://demoxmlurl',
    type: 'GET',
    dataType: "xml",
    success: parseXml
    });
});

将 HTML 用于 Ajax 请求

将 HTML 块传输到页面某处的 ajax 请求。

$.ajax({
    type : 'POST',
    url : 'post.php',
    dataType : 'json',
    data: {
        id : $('#id').val()
    },
});

为 Ajax 请求使用脚本

向页面添加新脚本的 ajax 请求。

$.ajax({
    url: 'http://unknown.jquery.com/foo',
    dataType: 'script',
    cache: true })
    .then(function () {
    console.log( 'Success' ); },
    function () {
    console.log( 'Failed' ); });

将 JSON 用于 Ajax 请求

用于传输 JSON 数据的 ajax 请求将包括任何类型的数据。

$.ajax({
    url: "delftstack.php",
    type: "POST",
    data: {
        ID: ID,
        First_Name: First_Name,
        Last_Name: Last_Name,
        Salary: Salary
    },
    dataType: "JSON",
    success: function (employee_data) {
        console.log("Success");
        $("#result").text(employee_data);
    }
});

使用 JSONP 处理 Ajax 请求

从另一个域传输 JSON 数据的 ajax 请求。

$.ajax({
    type: 'GET',
    url: url,
    async: false,
    jsonpCallback: 'jsonCallback',
    contentType: "application/json",
    dataType: 'jsonp',
    success: function(json) {
       console.dir(json.sites);
    },
    error: function(er) {
       console.log(er.message);
    }
});

将文本用于 Ajax 请求

传输纯文本字符串的 ajax 请求。

$.ajax({
    type: "POST",
    url:"delftstack.php",
    data: "{}",
    async: true,
    dataType: "text",
    success: function( data ) {
        console.log(data);
    }
});

声明：本站所有文章，如无特殊说明或标注，均为本站原创发布，任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站。本站所有源码与软件均为原作者提供，仅供学习和研究使用。如您对本站的相关版权有任何异议，或者认为侵犯了您的合法权益，请及时通知我们处理。