Question

我正在研究Free Code Camp's "Random Quote Machine"，我构建了一个非常（强调非常）基本模型，但我无法弄清楚如何使用引号并按照我的代码方式发布它们。我是否必须更改当前的Javascript代码才能发送推文，或者是否有办法用我当前的代码发送一条我没有意识到的推文？我知道有一个another question like this有一个解决方案，但我不明白。非常感谢。

＆＃13;

var quotes= [
    'I love you the more in that I believe you had liked me for my own sake 
    and for nothing else. John Keats', 
    'But man is not made for defeat. A man can be destroyed but 
    not defeated. Ernest Hemingway', 
    'When you reach the end of your rope, tie a knot in it and 
    hang on. Franklin D. Roosevelt', 
    'Always do what is right. It will gratify half of mankind 
    and astound the other. ― Mark Twain', 
    'Whenever you find yourself on the side of the majority, it 
    is time to pause and reflect. Mark Twain',
    'It is curious that physical courage should be so common in 
    the world, and moral courage so rare.- Mark Twain in Eruption',
    'A man should not be without morals; it is better to have 
    bad morals than none at all.- Mark Twain\'s Notebook',
    'The most permanent lessons in morals are those which come, 
    not of book teaching, but of experience.- A Tramp Abroad',
    'But the fact that he can do wrong proves his moral 
    inferiority to any creatures that cannot.― Mark Twain',
    '\“Wrong does not cease to be wrong because the majority 
    share in it.\” ― Leo Tolstoy',
    '\“Right is right even if no one is doing it; wrong is wrong 
    even if everyone is doing it.\” ― Augustine of Hippo'
]
function nextQuote() {
    var randomNumber = Math.floor(Math.random()*quotes.length);
    document.getElementById("displayQuote").innerHTML = quotes[randomNumber];
}

＆＃13;

<h1>Random Quote Machine</h1>
<!--Javascript will go in div-->
<div>
    <h2 id="displayQuote"></h2>
</div>
<button onclick="nextQuote()">New Quote</button>
<button id="tweetQuote"><a>Tweet</a></button>

＆＃13;

Answer 1

您的代码会抛出类似“未终止的字符串leteral”的错误，因为您的quotes - 数组元素中不得有线制动。

快速清理后 - 现在它就像魅力一样。

var quotes= [
    'I love you the more in that I believe you had liked me for my own sake and for nothing else. John Keats', 
    'But man is not made for defeat. A man can be destroyed but not defeated. Ernest Hemingway', 
    'When you reach the end of your rope, tie a knot in it and hang on. Franklin D. Roosevelt', 
    'Always do what is right. It will gratify half of mankind  and astound the other. ― Mark Twain', 
    'Whenever you find yourself on the side of the majority, it is time to pause and reflect. Mark Twain',
    'It is curious that physical courage should be so common in the world, and moral courage so rare.- Mark Twain in Eruption',
    'A man should not be without morals; it is better to have bad morals than none at all.- Mark Twain\'s Notebook',
    'The most permanent lessons in morals are those which come, not of book teaching, but of experience.- A Tramp Abroad',
    'But the fact that he can do wrong proves his moral inferiority to any creatures that cannot.― Mark Twain',
    '\“Wrong does not cease to be wrong because the majority share in it.\” ― Leo Tolstoy',
    '\“Right is right even if no one is doing it; wrong is wrong even if everyone is doing it.\” ― Augustine of Hippo'
]
function nextQuote() {
    var randomNumber = Math.floor(Math.random()*quotes.length);
    document.getElementById("displayQuote").innerHTML = quotes[randomNumber];
    document.getElementById("tweetQuote").href="https://twitter.com/intent/tweet/?text=" +  quotes[randomNumber];
}

<h1>Random Quote Machine</h1>
<!--Javascript will go in div-->
<div>
    <h2 id="displayQuote"></h2>
</div>
<button onclick="nextQuote()">New Quote</button>
<a href="#" id="tweetQuote"><button>Tweet</button></a>

如果某些内容不起作用，你必须调试代码......

Answer 2

虽然我的第一个答案是关于修复原始源代码，但这个更像是关于如何以更好的方式实现功能的建议。

＆＃13;

// lets start with a "Immediately Invoked Function Expression"
// to not pollute the global namespace
(function() {

    // cache elements that are reused
    var aQuotes = [ 'Quote 1', 'Quote 2', 'Quote 3', 'Quote 4' ],
        iQuotes = aQuotes.length,
        domDisplayQuote = document.getElementById("displayQuote"),
        domTweetQuote = document.getElementById("tweetQuote");

    // listen to "click event" on "button#nextQuote"
    document.getElementById("nextQuote").addEventListener('click', function() {

        var sQuote = aQuotes[ Math.floor( Math.random() * iQuotes ) ];
        // use cached DOMelements
        domDisplayQuote.innerHTML = sQuote;
        domTweetQuote.href="https://twitter.com/intent/tweet/?text=" + sQuote;

    }), false;

})()

＆＃13;

<h1>Random Quote Machine</h1>
<div>
    <h2 id="displayQuote"></h2>
</div>
<!-- instead of <button onclick="nextQuote()">New Quote</button> -->
<button id="nextQuote">New Quote</button>
<a href="#" id="tweetQuote"><button>Tweet</button></a>

＆＃13;

随机报价机，推特报价

2 个答案: