使用JavaScript测验的Twitter分享按钮

时间:2016-02-18 22:20:55

标签: javascript css html5 twitter

我有一个JavaScript测验,会产生一个结果来说明分数。

test.innerHTML = "<h2>You got "+correct+" of "+questions.length+" questions correct</h2>";
    _("test_status").innerHTML = "Test Completed";

我想有一个Twitter分享按钮,允许用户发布用户从测验中得到的分数。

任何想法如何做到这一点?

1 个答案:

答案 0 :(得分:0)

你可以:

  1. 您喜欢使用此网址:"https://twitter.com/intent/tweet?text=I got "+correct+" correct out of "+questions.length+" questions on JavaScript Quiz!"(尽管您需要使用JavaScript来创建它)。
  2. 使用简单的<a>链接,例如:<a class="twitter-share-button" href="#" id="twitter-button">Tweet</a>并将document.getElementById("twitter-button").setAttribute("href", "https://twitter.com/intent/tweet?text=I got "+correct+" correct out of "+questions+" questions on JavaScript Quiz!");添加到您的脚本中。
  3. 将以上链接以及此代码添加到您的脚本中,以制作一个精美的按钮:!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');
  4. 查看此代码段(该按钮在代码段中似​​乎不起作用,但它应该在本地和您的网站上运行):

    <a class="twitter-share-button" href="#" id="twitter-button">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'); correct = 5; questions = 10; document.getElementById("twitter-button").setAttribute("href", "https://twitter.com/intent/tweet?text=I got "+correct+" correct out of "+questions+" questions on JavaScript Quiz!");</script>

    您可以生成所有按钮脚本here。另外,看看here

    希望这有帮助! :)