在我的文字中添加推文按钮

时间:2016-10-19 02:30:36

标签: jquery html

您好,我是发展中国家的新人,我正在关注FreeCodeCamp并且我在随机报价机器上。我在添加Tweet按钮时遇到问题,当我不使用按钮时我可以发推文引用,但是当我使用添加按钮解决方案时。它推文标题。你能帮帮我吗? 谢谢你

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>RandomQuoteMachine</title>
    <script src="jquery-3.1.0.js"></script>
    <script type="text/javascript" src="script.js"></script>
    <link rel="stylesheet" type="text/css" href="styles.css"/>
</head>
<body>
     <div id= "target">
         <h2>Quote of the Day</h2>
         <div id="quoteRandom">
         <p lang="en"></p>
      </div>
      <div id="authorRandom">
         <p></p>
      </div>
      <div id="quoteButton">
         <button>Click Me</button>
         <a class="twitter-share-button" id="tweetPop" target="_blank"         href="https://twitter.com/intent/tweet" data-size="large">Tweet</a>
      </div>
     </div>
</body>
</html>`




$(document).ready(function(){
    var source = [
    {author:"Thomas Edison", qoute:"I have not failed. I have successsfully discovered 10,000 things that will not work."},
    {author:"George Bernard Shaw", qoute:"Science never solves a problem without creating ten more,"},
    {author:"Vanna Bonta", qoute:"Imposible is not a Scientific Term"},
    {author:"Albert Einstein", qoute:"The important thing is to never stop questioning"},
    {author:"Leonardo daVinci", qoute:"Life is pretty simple: You do some stuff. Most fails. Some works. You do more of what works. If  it works big, others quickly copy it."},
    {author:"Leornardo Davinci", qoute:"Learning never exhausts the mind."},
    {author:"Adam Smith", qoute:"Science is the great antidote to the poison of enthusiasm and superstition."},
    {author:"Bill Gates", qoute:"The first rule of any technology used in a business is that automation applied to an efficient operation will magnify the efficiency. The second is that automation applied to an inefficient operation will magnify the inefficiency. "},
    {author:"Stephen Hawking", qoute:"Scientists have become the bearers of the torch of discovery in our quest for knowledge."},
    ];

   $('#quoteButton').click(function(){
         $('#target').css("background-color", "#F0D7F7");
          });
         $.getScript('http://platform.twitter.com/widgets.js');
         $('body').on("click", "button", function()  {
              var quoteLength= Math.floor(Math.random() * source.length);

              $('#quoteRandom')
                 .html("<p><q>" + (source[quoteLength].qoute) + "</q></p>")
                 .css('opacity', 1)
                 .fadeIn( 30 )

              $('#authorRandom')
                 .html("<p>" + (source[quoteLength].author) + "</p>")
                 .css('opacity', 1)
                 .fadeIn( 30 )

              $('#tweetPop')
                 .attr("href", "https://twitter.com/intent/tweet?text=" +  ' " ' + (source[quoteLength].qoute) + ' " - ' + (source[quoteLength].author) );
            });
    });

1 个答案:

答案 0 :(得分:0)

在您的HTML中,您应该

<a id="tweetBtn" href="https://twitter.com/share" class="twitter-share-button" data-url="abc" data-text= randomQuoteMachine();>Tweet</a>
<script>
!function(d,s,id){
    var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';
    if(!d.getElementById(id)) {
        js=d.createElement(s);
        js.id=id;
        js.src=p+'://platform.twitter.com/widgets.js';
        fjs.parentNode.insertBefore(js,fjs);
    }
}(document, 'script', 'twitter-wjs');</script>

在你的javascript中,这就是我的方式:

document.getElementById('tweetBtn').dataset.text = quotes[index] + ' - ' + quoteA[index];

希望这有帮助!