http://www.cnblogs.com/cwp-bg/p/7668840.html  ajax和jsonp使用总结  2017-10-17


var requestUrl="http://localhost/1.html?callback=?";
$.ajax({
type : "get",
async:true,
url : requestUrl,
data : "channelid=7&current=1&rowSize=4",
dataType : "jsonp",
success :function(data){
console.log("--------(xxxxx)-----success");
},
error:function(data){
console.log("error: (xxxxx)");
}
});

注意:跨域要用jsonp,并且双方要有约定callback

php代码:

$callback=$_GET['callback'];
echo $callback."($res)";

检测手机app嵌入的H5页面,是否处于联网状态  2016-6-29

var requestUrl="http://localhost/1.html?callback=?";
var ajaxTimeoutTest = $.ajax({
type : "get",
timeout: 1000,//超出时间设置,单位毫秒
async:true,
url : requestUrl,
data : "channelid=7&current=1&rowSize=4",
dataType : "jsonp",
success :function(data){
console.log("--------(xxxxx)-----success");
},
error:function(data){
console.log("error: (xxxxx)");
},
complete:function(XMLHttpRequest,status){//请求完成后最终执行参数
if(status == 'timeout' ){ //超时,status还有success,error等值的情况
ajaxTimeoutTest.abort();
alert('超时');
} }
});

一个简单的ajax例子

<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(function(){
var TEST = {
test:function() {
//var requestUrl=GLOBAL.WEBSITE+"client/newspaper/getNewspaper.html?callback=?";
var requestUrl="http://121.199.44.182:8090/client/newspaper/getChannel.html?callback=?";
$.ajax({
type : "post",
async:true,
url : requestUrl,
data : "typeid=2&channelid=7",
dataType : "jsonp",
success :function(data){
console.log("-------------success");
console.log(data);
for(var i=0;i<data.length;i++){
console.log(data[i].id);
console.log(data[i].name);
}
},
error:function(data){
console.log("error:"+data[0]);
}
});
},
}; TEST.test();
});
</script>

用对象方式传参数:

var requestUrl="http://192.168.1.1/expai_data/counter?";
$.ajax({
type : "post",
async:true,
url : requestUrl,
data : "product="+product+"&name="+consignee+"&address="+address+"&phone="+phone+"&content="+content+"&step="+step+"&cpmc="+cpmc+"&src="+src,
/*
data:{
product : product,
name : consignee,
address : address,
phone : phone,
content : content,
step : step,
cpmc : cpmc,
},*/
dataType : "jsonp",
success :function(data){
//console.log("--------(xxxxx)-----success");
},
error:function(data){
//console.log("error: (xxxxx)");
}
});

一个简单的 $.getJSON 例子:2016-1-18

var targetUrl = "http://192.168.1.34:85/jiazhuang/ajax/?action=getMapInfo&callback=?";
$.getJSON(targetUrl,{
format: "json"
},
function(data) {
alert(data.type);
}
);

一个简单的 $.ajax 例子:2016-1-18

var targetUrl = "http://192.168.1.34:85/jiazhuang/ajax/?action=getMapInfo&callback=?";
$.ajax({
type: "get",
url: targetUrl,
data: {},
dataType: "jsonp",
jsonp : "callback",
async:true,
cache: false,
success: function(data) {
if(data.type==1){
console.log(data.msg);
}else{
console.log(data.msg);
}
},
error: function(data) {
console.log("操作失败");
},
});

 json解析成字符串、字符串解析为json:

var book={a:1,b:2}//这是原始的json
var jsonBook=JSON.stringify(book);//json解析成字符串
var objectBook=JSON.parse(jsonBook); //字符串解析为json
alert(book);
alert(jsonBook);
alert(objectBook.a);

.........

var requestUrl="http://localhost/1.html?callback=?";var ajaxTimeoutTest = $.ajax({    type : "get",    timeout: 1000,//超出时间设置,单位毫秒    async:true,    url : requestUrl,    data : "channelid=7&current=1&rowSize=4",    dataType : "jsonp",    success :function(data){        console.log("--------(xxxxx)-----success");    },    error:function(data){        console.log("error: (xxxxx)");    },    complete:function(XMLHttpRequest,status){//请求完成后最终执行参数    if(status == 'timeout' ){//超时,status还有success,error等值的情况    ajaxTimeoutTest.abort();    alert('超时');        }        }});

代码: !AJAX的更多相关文章

  1. 2、记录代码----Ajax

    $.ajax({ url:'/content-engine/index.php/tracker/confirmSendEmail', async: false, //默认为true,同意异步传输 da ...

  2. 框架基础:ajax设计方案(五)--- 集成promise规范,更优雅的书写代码

    距离上一篇博客书写,又过去了大概几个月了,这段时间暂时离开了这个行业,让大脑休息一下.一个人旅行,一个人休息,正好也去完成一个目标 --- 拥有自己的驾照.当然,也把自己晒的黑漆马虎的.不过这一段时间 ...

  3. 前端通信:ajax设计方案(五)--- 集成promise规范,更优雅的书写代码(改迭代已作废,移步迭代10)

    该迭代已作废,最新的请移步这里:https://www.cnblogs.com/GerryOfZhong/p/10726306.html 距离上一篇博客书写,又过去了大概几个月了,这段时间暂时离开了这 ...

  4. Python之Flask和Django框架解决跨域问题,配合附加ajax和fetch等js代码

    Flask框架py解决跨域问题示例: # -*- coding: utf- -*- # by zhenghai.zhang from flask import Flask, render_templa ...

  5. jQuery之ajax实现篇

    jQuery的ajax方法非常好用,这么好的东西,你想拥有一个属于自己的ajax么?接下来,我们来自己做一个简单的ajax吧. 实现功能 由于jq中的ajax方法是用了内置的deferred模块,是P ...

  6. jQuery.ajax(url,[settings])

    概述 通过 HTTP 请求加载远程数据. jQuery 底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等.$.ajax() 返回其创建的 XMLHttpRequest 对象. ...

  7. 页面滚动到底部自动 Ajax 获取文章

    页面滚动到底部自动 Ajax 获取文章  代码如下 复制代码 var _timer = {};function delay_till_last(id, fn, wait) {    if (_time ...

  8. SSH实战 · AJAX异步校验

    前台JS代码 /*异步验证用户名的输入格式以及是否存在*/ function CheckUsername(){      /*取到用户名输入框*/      var nametxt = documen ...

  9. Jquery通过Ajax方式来提交Form表单

    今天刚好看到Jquery的ajax提交数据到服务器的方法,原文是: 保存数据到服务器,成功时显示信息. jQuery 代码: $.ajax({ type: "POST", url: ...

  10. PHP中AJAX的使用(完整实例【大牛可飘过】)

    有一段时间不写关于AJAX的东西了,最近和同学参加个比赛,要做一个类似博客的东西,用到了AJAX的东西,在写东西之前为了再熟悉一下AJAX,自己做了个关于AJAX的小事例与大家分享一下. AJAX在j ...

随机推荐

  1. 一款非常不错的重写listctrl类-CListCtrlEx

    原文在:https://www.codeproject.com/Articles/28063/An-Extended-MFC-CListCtrl-to-edit-individual-cells li ...

  2. HTML和CSS标签常用命名规则

    1.Images 存放一些网站常用的图片: 2.Css 存放一些CSS文件: 3.Flash 存放一些Flash文件: 4.PSD 存放一些PSD源文件: 5.Temp 存放所有临时图片和其它文件: ...

  3. 剑指Offer 3. 从尾到头打印链表 (链表)

    题目描述 输入一个链表,按链表值从尾到头的顺序返回一个ArrayList. 题目地址 https://www.nowcoder.com/practice/d0267f7f55b3412ba93bd35 ...

  4. php英语单词大全95

    abstract抽象的 -挨伯丝拽克特 access存取.访问 -挨克色丝 account账户 -厄靠恩特 action动作 -爱克身 activate激活 -爱克特维特 active活动的 -爱克得 ...

  5. JAVA高级篇(三、JVM编译机制、类加载机制)

    一.类的加载过程 JVM将类的加载分为3个步骤: 1.装载(Load) 2.链接(Link) 3.初始化(Initialize) 其中 链接(Link)又分3个步骤,如下图所示: 1) 装载:查找并加 ...

  6. RabbitMQ学习之旅(一)

    RabbitMQ学习总结(一) RabbitMQ简介 RabbitMQ是一个消息代理,其接收并转发消息.类似于现实生活中的邮局:你把信件投入邮箱的过程,相当于往队列中添加信息,因为所有邮箱中的信件最终 ...

  7. cocos2dx开发之util类&方法——取当前系统时间

    返回time_t,即从1970年1月1日至今的秒数 time_t getSysTime(){ time_t currentTime = time(NULL); return currentTime; ...

  8. PTA——洗牌

    PTA 7-43 Shuffling Machine #include<stdio.h> int main() { int i,n,*result; scanf("%d" ...

  9. Python数据存储:pickle模块的使用讲解

    在机器学习中,我们常常需要把训练好的模型存储起来,这样在进行决策时直接将模型读出,而不需要重新训练模型,这样就大大节约了时间.Python提供的pickle模块就很好地解决了这个问题,它可以序列化对象 ...

  10. axiso实战问题

    this.axios({ method: 'get', url: '/api/projectmgt/project/Project/list', withCredentials : true, hea ...