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 相关文章推荐
JObj预览一个JS的框架
Mar 13 Javascript
js实时监听文本框状态的方法
Apr 26 Javascript
JavaScript与DOM组合动态创建表格实例
Dec 23 Javascript
js 文本滚动效果的实例代码
Aug 17 Javascript
AngularJs解决跨域问题案例详解(简单方法)
May 19 Javascript
微信小程序 Windows2008 R2服务器配置TLS1.2方法
Dec 05 Javascript
Webpack性能优化 DLL 用法详解
Aug 10 Javascript
简单实现js上传文件功能
Aug 21 Javascript
vue实现微信分享功能
Nov 28 Javascript
JS/HTML5游戏常用算法之碰撞检测 地图格子算法实例详解
Dec 12 Javascript
vue项目创建步骤及路由router
Jan 14 Javascript
javascript设计模式之迭代器模式
Jan 30 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代码
2010/08/08 PHP
php导出CSV抽象类实例
2014/09/24 PHP
ThinkPHP中limit()使用方法详解
2016/04/19 PHP
面向对象设计模式的核心法则
2013/11/10 Javascript
JS根据变量保存方法名并执行方法示例
2014/04/04 Javascript
jQuery EasyUi实战教程之布局篇
2016/01/26 Javascript
为什么JavaScript没有块级作用域
2016/05/22 Javascript
最实用的jQuery分页插件
2016/10/09 Javascript
jQuery EasyUI 获取tabs的实例解析
2016/12/06 Javascript
JS多文件上传的实例代码
2017/01/11 Javascript
jQuery实现select下拉框获取当前选中文本、值、索引
2017/05/08 jQuery
nginx配置React静态页面的方法教程
2017/11/03 Javascript
centos 上快速搭建ghost博客方法分享
2018/05/23 Javascript
详谈js的变量提升以及使用方法
2018/10/06 Javascript
微信小程序之裁剪图片成圆形的实现代码
2018/10/11 Javascript
利用jquery和BootStrap实现动态滚动条效果
2018/12/03 jQuery
JavaScript学习教程之cookie与webstorage
2019/06/23 Javascript
javascript实现简易聊天室
2019/07/12 Javascript
layui 实现二级弹窗弹出之后 关闭一级弹窗的方法
2019/09/18 Javascript
js如何验证密码强度
2020/03/18 Javascript
python实现SMTP邮件发送功能
2020/06/16 Python
python的paramiko模块实现远程控制和传输示例
2017/10/13 Python
Django操作session 的方法
2020/03/09 Python
520使用Python实现“我爱你”表白
2020/05/20 Python
HTML5中使用postMessage实现两个网页间传递数据
2016/06/22 HTML / CSS
AmazeUI 面板的实现示例
2020/08/17 HTML / CSS
公司财务自我评价分享
2013/12/17 职场文书
白酒业务员岗位职责
2013/12/27 职场文书
党支部承诺书范文
2014/03/28 职场文书
幼儿园大班开学寄语
2014/08/02 职场文书
群众路线教育实践活动整改落实情况汇报
2014/10/28 职场文书
逃课检讨书怎么写
2015/01/01 职场文书
2015年助残日活动总结
2015/03/27 职场文书
病危通知书样本
2015/04/17 职场文书
小学生暑假安全公约
2015/07/14 职场文书
中学校园广播稿
2015/08/18 职场文书