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 相关文章推荐
javascript中的new使用
Mar 20 Javascript
如何判断鼠标是否在DIV的区域内
Nov 13 Javascript
简单的Jquery遮罩层代码实例
Nov 14 Javascript
jqeury-easyui-layout问题解决方法
Mar 24 Javascript
JS动态增加删除UL节点LI及相关内容示例
May 21 Javascript
javascript实现淡蓝色的鼠标拖动选择框实例
May 09 Javascript
jquery使用each方法遍历json格式数据实例
May 18 Javascript
Javascript表单特效之十大常用原理性样例代码大总结
Jul 12 Javascript
js实现canvas保存图片为png格式并下载到本地的方法
Aug 31 Javascript
JavaScript实现左侧菜单效果
Dec 14 Javascript
vue实现多个元素或多个组件之间动画效果
Sep 25 Javascript
vue实现的组件兄弟间通信功能示例
Dec 04 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
调频问题解答
2021/03/01 无线电
php生成QRcode实例
2014/09/22 PHP
php学习笔记之基础知识
2014/11/08 PHP
thinkphp普通查询与表达式查询实例分析
2014/11/24 PHP
PHP读取文件内容的五种方式
2015/12/28 PHP
php5.5使用PHPMailer-5.2发送邮件的完整步骤
2018/10/14 PHP
PHP开发实现快递查询功能详解
2019/04/08 PHP
JavaScript Event学习第六章 事件的访问
2010/02/07 Javascript
Javascript根据指定下标或对象删除数组元素
2012/12/21 Javascript
intro.js 页面引导简单用法 分享
2013/08/06 Javascript
使用JS取得焦点(focus)元素代码
2014/03/22 Javascript
详解jQuery UI库中文本输入自动补全功能的用法
2016/04/23 Javascript
JavaScript 计算笛卡尔积实例详解
2016/12/02 Javascript
AngularJS表单提交实例详解
2017/02/18 Javascript
js弹出窗口简单实现代码
2017/03/22 Javascript
开发Vue树形组件的示例代码
2017/12/21 Javascript
jquery+ajaxform+springboot控件实现数据更新功能
2018/01/22 jQuery
vue数据传递--我有特殊的实现技巧
2018/03/20 Javascript
vue项目base64字符串转图片的实现代码
2018/07/13 Javascript
在react项目中使用antd的form组件,动态设置input框的值
2020/10/24 Javascript
使用Vant完成Dialog弹框案例
2020/11/11 Javascript
[02:27]刀塔重生降临
2015/10/14 DOTA
[00:59]DOTA2背景故事第二期之四大基本法则
2020/07/07 DOTA
详解python实现读取邮件数据并下载附件的实例
2017/08/03 Python
CHARLES & KEITH澳大利亚官网:新加坡时尚品牌
2019/01/22 全球购物
Club Monaco加拿大官网:设计师男女服装
2019/09/29 全球购物
下面代码从性能上考虑,有什么问题
2015/04/03 面试题
管理失职检讨书
2014/02/12 职场文书
公司管理建议书范文
2014/03/12 职场文书
公证书标准格式
2014/04/10 职场文书
国防教育标语
2014/10/08 职场文书
交通安全宣传标语(100条)
2019/08/22 职场文书
Python OpenCV 彩色与灰度图像的转换实现
2021/06/05 Python
Java Socket实现多人聊天系统
2021/07/15 Java/Android
python Django框架快速入门教程(后台管理)
2021/07/21 Python
Pandas自定义选项option设置
2021/07/25 Python