jQuery使用ajax跨域获取数据的简单实例


Posted in Javascript onMay 18, 2016

jQuery使用ajax跨域获取数据的简单实例

var webMethod = "http://localhost:54473/Service1.asmx/HelloWorld"; 

jQuery.support.cors = true;


//之前没有加这句老是提示no transport,我没去深想。
    $.ajax
    ({
      
      type: "POST",
      contentType: "application/x-www-form-urlencoded",
      dataType: "html",
      url: "http://www.*****.com", //这里是网址
      success:function(data){alert(data);},
      timeout:30000, 
      error: function (XMLHttpRequest, textStatus, errorThrown) {
      alert(errorThrown);
      }
    });

参数
options
类型:Object

可选。AJAX 请求设置。所有选项都是可选的。

async
类型:Boolean

默认值: true。默认设置下,所有请求均为异步请求。如果需要发送同步请求,请将此选项设置为 false。

注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。

beforeSend(XHR)
类型:Function

发送请求前可修改 XMLHttpRequest 对象的函数,如添加自定义 HTTP 头。

XMLHttpRequest 对象是唯一的参数。

这是一个 Ajax 事件。如果返回 false 可以取消本次 ajax 请求。

cache
类型:Boolean

默认值: true,dataType 为 script 和 jsonp 时默认为 false。设置为 false 将不缓存此页面。

jQuery 1.2 新功能。

complete(XHR, TS)
类型:Function

请求完成后回调函数 (请求成功或失败之后均调用)。

参数: XMLHttpRequest 对象和一个描述请求类型的字符串。

这是一个 Ajax 事件。

contentType
类型:String

默认值: "application/x-www-form-urlencoded"。发送信息至服务器时内容编码类型。

默认值适合大多数情况。如果你明确地传递了一个 content-type 给 $.ajax() 那么它必定会发送给服务器(即使没有数据要发送)。

context
类型:Object

这个对象用于设置 Ajax 相关回调函数的上下文。也就是说,让回调函数内 this 指向这个对象(如果不设定这个参数,那么 this 就指向调用本次 AJAX 请求时传递的 options 参数)。比如指定一个 DOM 元素作为 context 参数,这样就设置了 success 回调函数的上下文为这个 DOM 元素。

就像这样:

$.ajax({ url: "test.html", context: document.body, success: function(){
    $(this).addClass("done");
   }});

data
类型:String

发送到服务器的数据。将自动转换为请求字符串格式。GET 请求中将附加在 URL 后。查看 processData 选项说明以禁止此自动转换。必须为 Key/Value 格式。如果为数组,jQuery 将自动为不同值对应同一个名称。如 {foo:["bar1", "bar2"]} 转换为 '&foo=bar1&foo=bar2'。

dataFilter
类型:Function

给 Ajax 返回的原始数据的进行预处理的函数。提供 data 和 type 两个参数:data 是 Ajax 返回的原始数据,type 是调用 jQuery.ajax 时提供的 dataType 参数。函数返回的值将由 jQuery 进一步处理。

dataType
类型:String

预期服务器返回的数据类型。如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息来智能判断,比如 XML MIME 类型就被识别为 XML。在 1.4 中,JSON 就会生成一个 JavaScript 对象,而 script 则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后,传递给回调函数。可用值:

•"xml": 返回 XML 文档,可用 jQuery 处理。

•"html": 返回纯文本 HTML 信息;包含的 script 标签会在插入 dom 时执行。

•"script": 返回纯文本 JavaScript 代码。不会自动缓存结果。除非设置了 "cache" 参数。注意:在远程请求时(不在同一个域下),所有 POST 请求都将转为 GET 请求。(因为将使用 DOM 的 script标签来加载)

•"json": 返回 JSON 数据 。

•"jsonp": JSONP 格式。使用 JSONP 形式调用函数时,如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。

•"text": 返回纯文本字符串
error
类型:Function

默认值: 自动判断 (xml 或 html)。请求失败时调用此函数。

有以下三个参数:XMLHttpRequest 对象、错误信息、(可选)捕获的异常对象。

如果发生了错误,错误信息(第二个参数)除了得到 null 之外,还可能是 "timeout", "error", "notmodified" 和 "parsererror"。

这是一个 Ajax 事件。

global
类型:Boolean

是否触发全局 AJAX 事件。默认值: true。设置为 false 将不会触发全局 AJAX 事件,如 ajaxStart 或 ajaxStop 可用于控制不同的 Ajax 事件。

ifModified
类型:Boolean

仅在服务器数据改变时获取新数据。默认值: false。使用 HTTP 包 Last-Modified 头信息判断。在 jQuery 1.4 中,它也会检查服务器指定的 'etag' 来确定数据没有被修改过。

jsonp
类型:String

在一个 jsonp 请求中重写回调函数的名字。这个值用来替代在 "callback=?" 这种 GET 或 POST 请求中 URL 参数里的 "callback" 部分,比如 {jsonp:'onJsonPLoad'} 会导致将 "onJsonPLoad=?" 传给服务器。

jsonpCallback
类型:String

为 jsonp 请求指定一个回调函数名。这个值将用来取代 jQuery 自动生成的随机函数名。这主要用来让 jQuery 生成度独特的函数名,这样管理请求更容易,也能方便地提供回调函数和错误处理。你也可以在想让浏览器缓存 GET 请求的时候,指定这个回调函数名。

password
类型:String

用于响应 HTTP 访问认证请求的密码

processData
类型:Boolean

默认值: true。默认情况下,通过data选项传递进来的数据,如果是一个对象(技术上讲只要不是字符串),都会处理转化成一个查询字符串,以配合默认内容类型 "application/x-www-form-urlencoded"。如果要发送 DOM 树信息或其它不希望转换的信息,请设置为 false。

scriptCharset
类型:String

只有当请求时 dataType 为 "jsonp" 或 "script",并且 type 是 "GET" 才会用于强制修改 charset。通常只在本地和远程的内容编码不同时使用。

success
类型:Function

请求成功后的回调函数。

参数:由服务器返回,并根据 dataType 参数进行处理后的数据;描述状态的字符串。

这是一个 Ajax 事件。

traditional
类型:Boolean

如果你想要用传统的方式来序列化数据,那么就设置为 true。请参考工具分类下面的 jQuery.param 方法。

timeout
类型:Number

设置请求超时时间(毫秒)。此设置将覆盖全局设置。

type
类型:String

默认值: "GET")。请求方式 ("POST" 或 "GET"), 默认为 "GET"。注意:其它 HTTP 请求方法,如 PUT 和 DELETE 也可以使用,但仅部分浏览器支持。

url
类型:String

默认值: 当前页地址。发送请求的地址。

username
类型:String

用于响应 HTTP 访问认证请求的用户名。

xhr
类型:Function

需要返回一个 XMLHttpRequest 对象。默认在 IE 下是 ActiveXObject 而其他情况下是 XMLHttpRequest 。用于重写或者提供一个增强的 XMLHttpRequest 对象。这个参数在 jQuery 1.3 以前不可用。

以上这篇jQuery使用ajax跨域获取数据的简单实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用js实现的页面关键字密度查询代码
Dec 27 Javascript
ajaxControlToolkit AutoCompleteExtender的用法
Oct 30 Javascript
jquery 弹出层注册页面等(asp.net后台)
Jun 17 Javascript
CheckBoxList多选样式jquery、C#获取选择项
Sep 06 Javascript
漫谈JS引擎的运行机制 你应该知道什么
Jun 15 Javascript
Bootstrap基本插件学习笔记之Alert警告框(20)
Dec 08 Javascript
js使用i18n实现页面国际化的方法
May 09 Javascript
Vue.js 单页面多路由区域操作的实例详解
Jul 17 Javascript
JavaScript时间戳与时间日期间相互转换
Dec 11 Javascript
js判断输入框不能为空格或null值的实现方法
Mar 02 Javascript
vue 组件中slot插口的具体用法
Apr 03 Javascript
JS+canvas五子棋人机对战实现步骤详解
Jun 04 Javascript
JQuery 的跨域方法推荐_可跨任何网站
May 18 #Javascript
深入理解jquery跨域请求方法
May 18 #Javascript
判断是否存在子节点的实现代码
May 18 #Javascript
利用AJAX实现WordPress中的文章列表及评论的分页功能
May 17 #Javascript
Bootstrap教程JS插件弹出框学习笔记分享
May 17 #Javascript
Bootstrap组件学习之导航、标签、面包屑导航(精品)
May 17 #Javascript
BootStrap的alert提示框的关闭后再显示怎么解决
May 17 #Javascript
You might like
URL Rewrite的设置方法
2007/01/02 PHP
php编写的一个E-mail验证类
2015/03/25 PHP
PHP使用http_build_query()构造URL字符串的方法
2016/04/02 PHP
Yii CDBCriteria常用方法实例小结
2017/01/19 PHP
ThinkPHP3.2框架自定义配置和加载用法示例
2018/06/14 PHP
JavaScript学习笔记(十七)js 优化
2010/02/04 Javascript
js Dialog 实践分享
2012/10/22 Javascript
jquery及原生js获取select下拉框选中的值示例
2013/10/25 Javascript
javascript(js)的小数点乘法除法问题详解
2014/03/07 Javascript
jQuery.parseJSON(json)将JSON字符串转换成js对象
2014/07/27 Javascript
JS在可编辑的div中的光标位置插入内容的方法
2014/11/20 Javascript
JavaScript中获取Radio被选中的值
2015/11/11 Javascript
Jquery 垂直多级手风琴菜单附源码下载
2015/11/17 Javascript
AngualrJS中每次$http请求时的一个遮罩层Directive
2016/01/26 Javascript
javascript正则表达式总结
2016/02/29 Javascript
ionic2 tabs 图标自定义实例
2017/03/08 Javascript
nodejs中解决异步嵌套循环和循环嵌套异步的问题
2017/07/12 NodeJs
vue+axios新手实践实现登陆的示例代码
2018/06/06 Javascript
jquery实现选项卡切换代码实例
2019/05/14 jQuery
Vue使用lodop实现打印小结
2019/07/06 Javascript
JS中数组实现代码(倒序遍历数组,数组连接字符串)
2019/12/29 Javascript
echarts浮动显示单位的实现方法示例
2020/12/04 Javascript
在Django的模型中添加自定义方法的示例
2015/07/21 Python
python基础教程项目三之万能的XML
2018/04/02 Python
Win10下Python3.7.3安装教程图解
2019/07/08 Python
Pycharm和Idea支持的vim插件的方法
2020/02/21 Python
如何把python项目部署到linux服务器
2020/08/26 Python
用HTML5制作视频拼图的教程
2015/05/13 HTML / CSS
Artist Guitars新西兰:乐器在线商店
2017/09/17 全球购物
迪拜领先运动补剂零售品牌中文站:Sporter商城
2019/08/20 全球购物
在阿联酋购买翻新手机和平板电脑:Teckzu
2021/02/12 全球购物
优秀广告词大全
2014/03/19 职场文书
小学副班长竞选稿
2015/11/21 职场文书
校长新学期寄语2016
2015/12/04 职场文书
五年级作文之劳动作文
2019/11/12 职场文书
Android开发EditText禁止输入监听及InputFilter字符过滤
2022/06/10 Java/Android