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. Caffe中Interp层的使用

    最近实验当中借鉴了FPN网络,由于FPN网络对图片shape有要求,采用了两种方式,其一是在data_layer.cpp中,对原图进行padding操作:其二是需要对特征图进行类似crop操作,使得两 ...

  2. Android开发 ---基本UI组件5:监听下拉选项,动态绑定下拉选项、全选/反选,取多选按钮的值,长按事件,长按删除,适配器的使用,提示查询数据,activity控制多按钮

    效果图: 效果描述: 1.当点击 1 按钮后,进入选择城市的页面,会监听到你选中的城市名称:动态为Spinner绑定数据 2.当点击 2 按钮后,进入自动查询数据页面,只要输入首字母,就会动态查找以该 ...

  3. Power Query Advanced Editor键盘快捷键

    当你点击阅读这篇文章,第一眼看到这首图,是不是不太明白?实际上是小悦对Power BI 功能的12月更新的部分功能很有兴趣,所以今天想用这张张首图作为例,延伸测试键盘快捷键的简单应用,还真别说,确实还 ...

  4. python 写的员工信息查询

    #!/use/bin/env pythonn#_*_ coding:utf-8 _*_import timedef Bre():    while True:        Bre_falg = ra ...

  5. 基于redis的延迟消息队列设计(转)

    需求背景 用户下订单成功之后隔20分钟给用户发送上门服务通知短信 订单完成一个小时之后通知用户对上门服务进行评价 业务执行失败之后隔10分钟重试一次 类似的场景比较多 简单的处理方式就是使用定时任务 ...

  6. 我的代码-data pulling

    # coding: utf-8 import datetimeimport timefrom sqlalchemy.engine import create_enginefrom sqlalchemy ...

  7. 在Linux中执行.sh脚本,异常

    在Linux中执行.sh脚本,异常/bin/sh^M: bad interpreter: No such file or directory. 分析:这是不同系统编码格式引起的:在windows系统中 ...

  8. centos下配置maven编译环境

    版本centos6jdk1.7findbugs-3.0.1maven-3.0.5protobuf-2.6.0安装yum install lzo-devel zlib-devel gcc gcc-c++ ...

  9. java 程序编译和运行过程

    java整个编译以及运行的过程相当繁琐,我就举一个简单的例子说明: Java程序从源文件创建到程序运行要经过两大步骤: 1.源文件由编译器编译成字节码(ByteCode): 2.字节码由java虚拟机 ...

  10. mac下pycharm快捷键

    [转载]https://www.cnblogs.com/leolichao/p/9329685.html Mac键盘符号和修饰键说明 ⌘ Command ⇧ Shift ⌥ Option ⌃ Cont ...