2017-07-19 6 views
1

私はAPIからランダムな見積もりを引っ張って、その点ですべて作業しているページを作成しましたが、textContentをプルしてツイートに追加することはできませんボタン。ここでObject.textContentから見積りを外す

は私のコードです:

HTML

<div id="quote-box"> 
    <div id="quote-copy"> 
    <i class="fa fa-quote-left" id="quotation"> </i> 
    <span class="text" id="random-quote"></span> 
    </div> 
    <div id="quote-author"> 
    - <span class="author"></span> 
    </div> 
    <div id="quote-buttons"> 
    <a class="button" id="instagram" title="follow me on IG!" target="_blank" href="https://www.instagram.com/dopeland/"><i class="fa fa-instagram" aria-hidden="true"></i> Instagram</a> 
    <a class="button" id="tweet-this" title="Tweet This Quote!" href="https://twitter.com/share" target="_blank" data-size="large"><i class="fa fa-twitter" aria-hidden="true"></i> Tweet This!</a> 
    <a class="button" id="get-quote" title="Generate a new quote!" href="">New Quote</a> 
    </div> 
</div> 


Javascriptを

function getQuote(){ 
    $.ajax({ 
     url: 'https://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1', 
     success: function(data) { 
     var post = data.shift(); 
     $('.author').text(post.title); 
     $('.text').html(post.content); 
     }, 
     cache: false 
    }); 
    }; 

function changeColor(){ 
    var colors = ['#7A918D', '#93B1A7', '#99C2A2', '#C5EDAC', '#DBFEB8']; 
    var randNum = Math.floor(Math.random() * (colors.length - 0)); 

    document.body.style.background = colors[randNum]; 
    $('#quotation').css('color', colors[randNum]); 
}; 



$(document).ready(function() { 
    getQuote(); 
    changeColor(); 

    var randomQuote = $('#random-quote')["0"].textContent; 

    $('#tweet-this').click(function(){ 
    $(this).attr('href', "https://twitter.com/intent/tweet?text=" + randomQuote); 
    }); 

    $('#get-quote').on('click', function(e) { 
    e.preventDefault(); 
    getQuote(); 
    changeColor(); 
    }); 
}); 


は、だから私の問題は、私はつぶやきをクリックしたときにということですhttps://codepen.io/dopeland/pen/XgwNdB

答えて

0

移動var randomQuote = $('#random-quote')["0"].textContent;をごclickリスナー

の内そうのように:

$('#tweet-this').click(function(){ 
    var randomQuote = $('#random-quote')["0"].textContent; 
    $(this).attr('href', "https://twitter.com/intent/tweet?text=" + randomQuote); 
}); 

ボタン、私は唯一の "https://twitter.com/intent/tweet?text="

あなたはまた、ここに私のCodePenを見ることができるリンクが戻っていますrandomQuoteが最初に1回割り当てられます(値""に設定されています)。 clickリスナーに電話していても、見積もりの​​テキストは決してrandomQuoteに書き込まれず、常に""のままです。

フォーク固定コード:https://codepen.io/eqwert/pen/owraVK

関連する問題