【JQuery】名人名言生成应用

虽然我是一名实打实的产品喵，但是为了能够和程序猿们愉快地沟通（让撕逼再和谐一点），我自学了一些代码知识，写了一些不入流不靠谱不成熟的“三不”应用，随便扔在这里分享一下。

简介

这是一款名人名言生成器，使用的是AJAX通过API获取JSONP格式数据并展现在页面上，获取的名人名言还能够一键分享至Twitter或微博。

截图

图中显示着一条马丁路德金的名言

代码

HTML+CSS框架使用的是bootstrap 3，不过这里主要分享一下js部分的代码，使用的是JQuery：

window.onload = function () {
    $(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));
  })
});
}

相关

想看源代码的童鞋可以来CODING.NET获取，也可以直接去DEMO体验一下。

---

THE END.