麻豆小视频在线观看_中文黄色一级片_久久久成人精品_成片免费观看视频大全_午夜精品久久久久久久99热浪潮_成人一区二区三区四区

首頁 > 網站 > WEB開發 > 正文

基于JQuery及AJAX(JSONP)的名人名言隨機生成器

2024-04-27 15:19:35
字體:
來源:轉載
供稿:網友

這是我剛接觸Ajax的時候做的一個小應用,主要功能如下:

1.點擊按鈕可以隨機生成一句名人名言及其作者名字,如果沒有作者名字,則顯示“Unknown”。

2.點擊按鈕可以把名人名言分享到推特或者微博。

HTML:

<div class="container-fluid text-center">  <h1>    Random Quote Generator  </h1>  <div class="well quote-area">    <span class="quote">    </span>    <span class="author">    </span>  </div>  <div class="btns">    <button class="btn btn-default btn-lg" id="tweet">      <i class="fa fa-twitter" aria-hidden="true">      </i>        Tweet    </button>    <button class="btn btn-default btn-lg" id="weibo">      <i class="fa fa-weibo" aria-hidden="true">      </i>        Weibo    </button>    <button class="btn btn-default btn-lg" id="change">      <i class="fa fa-exchange" aria-hidden="true">      </i>        Get Quote    </button>  </div></div><footer class="text-center">  Designed by  <a href="http://blog.csdn.net/alenhhy" target="_blank">    Alen Hu  </a></footer>

JQuery:

$(document).ready(function() {  var quote, author;  function getNewQuote() {    $.ajax({      type: "get",      url: "http://api.forismatic.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://twitter.com/intent/tweet?text=' + encodeURIComponent(quote + ' by ' + author));  });  $('#weibo').on('click',  function(event) {    event.preventDefault();    window.open('http://v.t.sina.com.cn/share/share.php?title=' + encodeURIComponent(quote + ' by ' + author));  })});

*forismatic的API可以獲取名人名言,但是只有英語和俄語版本的...不過中文類似的API也有很多的啦,實現原理都差不多。

DEMO在這兒,歡迎來FORK:Random Quote Generator。


發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 国产精品一区二区三区在线播放 | 麻豆自拍偷拍视频 | 日韩欧美高清片 | 爱高潮www亚洲精品 国产精品一区自拍 | 欧美一级特黄a | v11av在线视频成人 | 亚洲精品一区二区三区大胸 | 九色中文字幕 | 久久美女色视频 | 国产精品视频二区不卡 | 另类亚洲孕妇分娩网址 | bt 自拍 另类 综合 欧美 | 爽爽淫人综合网网站 | 极品xxxx欧美一区二区 | 中国fx性欧美xxxx | 欧美日本91精品久久久久 | 中文字幕www. | 久久国产精品久久久久久 | 韩国19禁在线 | 国产精品视频一区二区三区四区五区 | 黄色va视频 | 特级毛片免费视频 | jizzzxxxxhd| 久久av免费 | v11av在线播放 | 国内毛片视频 | 国产羞羞视频免费在线观看 | 中文字幕观看 | 中文字幕欧美日韩 | 免费观看在线 | 成人毛片免费看 | 久久国产精品二国产精品中国洋人 | 成人在线视频播放 | 久久久久女人精品毛片九一 | www.91sp| 五月天堂婷婷 | 久久蜜臀一区二区三区av | 国产69精品久久久久99尤 | 久久另类视频 | 一区二区三区欧美精品 | 美女亚洲 |