JQuery与Ajax调用新浪API获取短网址的代码


Posted in Javascript onFebruary 07, 2014
<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>获取新浪短网址</title> 
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js"></script> 
<!--<script type="text/javascript" src="js/jquery-2.1.0.min.js"></script>--> 
</head> 
<body> 
<label for="long">长网址:</label> 
<input value="http://baike.baidu.com/link?url=XLrVdYRThMvU_DlDT67v2wg9XYgG3xXvsB97WZFDz4psPORqGotkTiH1O5L1SGrD9Du-OSxWt_5E2KNtk01HhK" id="long"><br><br> 
<label for="app_key">输入您的app_key(没有可到网上搜索):</label><br> 
<input value="211160679" id="app_key"><br><br> 
<span id="short">短网址:</span><br><br> 
<span id="dlgcy">调用地址:</span><br><br> 
<button type="button" id="btn">Click me</button><br> 
<!--<span id="link">网址:</span>--> 
<br><br><br> 
<a href="http://www.cnblogs.com/azure/archive/2012/08/29/WeiboAPI.html" target="_blank">参考文章:以短链服务为例,探讨免AppKey、免认证、Ajax跨域调用新浪微博API</a> 
<br><br> 
<a href="http://open.weibo.com/tools/console?uri=short_url/shorten&httpmethod=GET&key1=url_long&value1=http%3A%2F%2Fopen.weibo.com%2Fqa" target="_blank">新浪API测试</a> 
</body> <script type="text/javascript"> 
$(document).ready(function(){ 
$("#btn").click(function(){ 
var short = $("#short"); 
var long = $("#long").val(); //获取属性值; 
//var url = "https://api.weibo.com/2/short_url/shorten.json"; //官方API地址; 
var url2 = "http://api.weibo.com/2/short_url/shorten.json"; 
var app_key = $("#app_key").val();//app_key无效可能会导致无反应; 
//var access_token; 
//var cmd = url + "&url_long=" + long + "&access_token=" + access_token; 
var cmd2 = url2 + "?source=" + app_key + "&url_long=" + long; 
var message=""; 
$.ajax({ //底层方法; 
url: cmd2, 
type: "GET", 
dataType: "jsonp", //使用JSONP方法进行AJAX,json有跨域问题; 
cache: false, 
success: function (data, status) { 
//获取传回的信息; 
for(x in data.data.urls[0]) message += x+'='+data.data.urls[0][x]+'&'; 
alert("Data:\n" + message + "\n\nStatus: " + status); 
short.append( data.data.urls[0].url_short + "<br>"); 
//$("#dlgcy").hide(); 
$("#dlgcy").text(cmd2); 
}, 
error: function(obj,info,errObj){ 
alert("$.ajax()中发生错误:" + info); 
} 
}); 
}); 
}); 
</script> 
</html>

代码下载
Javascript 相关文章推荐
JS类库Bindows1.3中的内存释放方式分析
Mar 08 Javascript
javascript 放大镜效果js组件 qsoft.PopBigImage.v0.35 加入了chrome支持
Apr 07 Javascript
jqPlot 基于jquery的画图插件
Apr 26 Javascript
jQuery中.live()方法的用法深入解析
Dec 30 Javascript
深入学习jQuery Validate表单验证(二)
Jan 18 Javascript
详解微信小程序 页面跳转 传递参数
Dec 08 Javascript
Node.js中.pfx后缀文件的处理方法
Mar 10 Javascript
微信小程序 下拉菜单简单实例
Apr 13 Javascript
详解Angular5路由传值方式及其相关问题
Apr 28 Javascript
微信小程序实现星级评分和展示
Jul 05 Javascript
Vue项目中使用jsonp抓取跨域数据的方法
Nov 10 Javascript
JS实现电商商品展示放大镜特效
Jan 07 Javascript
jquery Ajax 实现加载数据前动画效果的示例代码
Feb 07 #Javascript
jquery.ajax的url中传递中文乱码问题的解决方法
Feb 07 #Javascript
jquery ajax传递中文参数乱码问题及解决方法说明
Feb 07 #Javascript
Ajax提交与传统表单提交的区别说明
Feb 07 #Javascript
JQUERY 设置SELECT选中项代码
Feb 07 #Javascript
jquery操作select详解(取值,设置选中)
Feb 07 #Javascript
jquery select 设置默认选中的示例代码
Feb 07 #Javascript
You might like
PHP实现分页的一个示例
2006/10/09 PHP
解决File size limit exceeded 错误的方法
2013/06/14 PHP
PHP实现把数字ID转字母ID
2013/08/12 PHP
PHP使用CURL模拟登录的方法
2015/07/08 PHP
老生常谈PHP数组函数array_merge(必看篇)
2017/05/25 PHP
用JavaScript编写COM组件的步骤
2009/03/17 Javascript
jQuery 前的按键判断代码
2010/03/19 Javascript
基于jQuery替换table中的内容并显示进度条的代码
2011/08/02 Javascript
javascript判断css3动画结束 css3动画结束的回调函数
2015/03/10 Javascript
JS模仿手机端九宫格登录功能实现代码
2016/04/28 Javascript
jQuery实现下拉框多选 jquery-multiselect 的实例代码
2016/07/14 Javascript
Node.js中process模块常用的属性和方法
2016/12/13 Javascript
Bootstrap table右键功能实现方法
2017/02/20 Javascript
使用AngularJS2中的指令实现按钮的切换效果
2017/03/27 Javascript
如何使用Bootstrap 按钮实例详解
2017/03/29 Javascript
React组件对子组件children进行加强的方法
2019/06/23 Javascript
微信小程序拼接图片链接无底洞深入探究
2019/09/03 Javascript
Vue 动态路由的实现及 Springsecurity 按钮级别的权限控制
2019/09/05 Javascript
vue 导航锚点_点击平滑滚动,导航栏对应变化详解
2020/08/10 Javascript
[31:00]2014 DOTA2华西杯精英邀请赛5 24 NewBee VS iG
2014/05/25 DOTA
[00:37]2016完美“圣”典风云人物:rOtk宣传片
2016/12/09 DOTA
[01:07:13]TNC vs Pain 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/20 DOTA
Ubuntu下升级 python3.7.1流程备忘(推荐)
2018/12/10 Python
pytorch梯度剪裁方式
2020/02/04 Python
keras 解决加载lstm+crf模型出错的问题
2020/06/10 Python
python collections模块的使用
2020/10/16 Python
深入浅析css3 border-image边框图像详解
2015/11/24 HTML / CSS
电子商务专业毕业生工作推荐信
2013/11/17 职场文书
档案信息化建设方案
2014/05/16 职场文书
事业单位人员的自我评价范文
2014/09/21 职场文书
普通党员个人剖析材料
2014/10/08 职场文书
出差报告格式模板
2014/11/06 职场文书
重阳节慰问信
2015/02/15 职场文书
2016年春节慰问信息大全
2015/11/30 职场文书
Html5大屏数据可视化开发的实现
2021/06/11 HTML / CSS
Javascript中async与await的捕捉错误详解
2022/03/03 Javascript