迹忆客 专注技术分享

当前位置:主页 > 学无止境 > WEB前端 > JavaScript >

jQuery 中的 $.Ajax 数据类型

作者:迹忆客 最近更新:2024/03/24 浏览次数:

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);
  }
});

转载请发邮件至 1244347461@qq.com 进行申请,经作者同意之后,转载请以链接形式注明出处

本文地址:

相关文章

用 jQuery 检查复选框是否被选中

发布时间:2024/03/24 浏览次数:98 分类:JavaScript

在本教程中学习 jQuery 检查复选框是否被选中的所有很酷的方法。我们展示了使用直接 DOM 操作、提取 JavaScript 属性的 jQuery 方法以及使用 jQuery 选择器的不同方法。你还将找到许多有用的

JavaScript POST

发布时间:2024/03/23 浏览次数:88 分类:JavaScript

本教程讲解如何在不使用 JavaScript 表单的情况下发送 POST 数据。

扫一扫阅读全部技术教程

社交账号
  • https://www.github.com/onmpw
  • qq:1244347461

最新推荐

教程更新

热门标签

扫码一下
查看教程更方便