最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
基于JQuery及AJAX实现名人名言随机生成器
时间:2022-06-25 17:15:45 编辑:袖梨 来源:一聚教程网
这是我刚接触AJAX的时候做的一个小应用,主要功能如下:
1.点击按钮可以随机生成一句名人名言及其作者名字,如果没有作者名字,则显示“Unknown”。
2.点击按钮可以把名人名言分享到推特或者微博。
HTML:
| 代码如下 | 复制代码 |
|
Random Quote Generator
Tweet
Get Quote
Designed by Alen Hu
|
|
JQuery:
| 代码如下 | 复制代码 |
|
$(document).ready(function() { varquote, author;
functiongetNewQuote() { $.ajax({ type:"get", url:"http://api.fo*r*isma*tic.com/api/1.0/", jsonp:'jsonp', dataType:'jsonp', data: { method:'getQuote', lang:'en', format:'jsonp' }, success:function(response) { quote = response.quoteText; author = response.quoteAuthor; $('.quote').text('"'+ quote +'"'); if(author) { $('.author').text('by '+ author); }else{ $('.author').text('by Unknown'); } } }); }
getNewQuote();
$('#change').on('click', function(event) { event.preventDefault(); getNewQuote(); });
$('#tweet').on('click', function(event) { event.preventDefault(); window.open('http://tw**itter.c*om/intent/tweet?text='+ encodeURIComponent(quote +' by '+ author)); });
$('#weibo').on('click', function(event) { event.preventDefault(); window.open('http://v.*t.s*ina.*com.cn/share/share.php?title='+ encodeURIComponent(quote +' by '+ author)); }) }); |
|
*forismatic的API可以获取名人名言,但是只有英语和俄语版本的...不过中文类似的API也有很多的啦,实现原理都差不多。
DEMO在这儿,欢迎来FORK:Random Quote Generator。
相关文章
- qq查价免费通道-qq估价一键查询方案 02-04
- 学习通官网登录入口-学习通在线平台直达链接 02-04
- 非麻瓜漫画官方网页入口下载安装最新版本-非麻瓜漫画官方正版入口安卓苹果通用 02-04
- ao3最新链接入口-ao3官网直达入口 02-04
- 差差漫画在线阅读入口-差差漫画免费登录入口 02-04
- 差差漫画安卓完整版下载-差差漫画2026最新版v1.0下载 02-04