Question

我正在尝试显示一个Twitter按钮，但是twitter按钮的代码显示为文本链接。我一直在努力解决问题，但它不会改回按钮。我究竟做错了什么？请帮忙。

var i = 0;

var a;
var b;
var c;
var d;

function calculate() {

  console.log(1);
  var activity = $("#txtActivity").val();

  var days = parseInt( $("#txtDays").val(), 10);
  var hours = parseInt( $("#txtHours").val(), 10);
  var minutes = parseInt( $("#txtMinutes").val(), 10);
  var seconds = parseInt( $("#txtSeconds").val(), 10);

  var MoneyMadeDuringActivity = (days * 21464) + (hours * 2683) + (minutes * 44.72) + (seconds * 0.74);
  MoneyMadeDuringActivity = MoneyMadeDuringActivity.toFixed(2);

  if (isNaN(MoneyMadeDuringActivity)) {
    MoneyMadeDuringActivity = 0.00;
  }

  if (i < MoneyMadeDuringActivity) {
    if (a < MoneyMadeDuringActivity) { i = i + a; }
    if (b < MoneyMadeDuringActivity) { i = i + b; }
    if (c < MoneyMadeDuringActivity) { i = i + c; }
    if (d < MoneyMadeDuringActivity) { i = i + d; }
  } else if (i > MoneyMadeDuringActivity) {
    if (a < MoneyMadeDuringActivity) { i = i - a; }
    if (b < MoneyMadeDuringActivity) { i = i - b; }
    if (c < MoneyMadeDuringActivity) { i = i - c; }
    if (d < MoneyMadeDuringActivity) { i = i - d; }
  }

  $.getScript("http://platform.twitter.com/widgets.js");
  var twit_link = $('<a/>', {
    href : 'https://www.twitter.com/share',
    'class' : 'twitter-share-button',
    url : 'http://www.twitter.com/obamamakes',
    'data-count' : 'none',
    'data-via' : 'ObamaMakes',
    'data-text' : 'In the time it takes me to ' + activity + ', Barack Obama makes $' + i.toFixed(1)
  }).text('Tweet');

  $("#CalcOutput").html("In the time it takes me to <span class=\"num\">" + activity + "</span>,<br /> Barack Obama makes <span class=\"num\">" + "$" + i.toFixed(1) + "</span><br />");
  $("#CalcOutput").append( twit_link );
}

  $("#txtDays").focus(function() {
    $(this).val('');
  });
  $("#txtDays").keyup(function(event) {
    a = 2683;
    setInterval(calculate, 5);
  });

  $("#txtHours").focus(function(){
    $(this).val('');
  });
  $("#txtHours").keyup(function(event) {
    b = 670.75;
    setInterval(calculate, 5);
  });

  $("#txtMinutes").focus(function() {
    $(this).val('');
  });
  $("#txtMinutes").keyup(function(event) {
    c = 22.36;
    setInterval(calculate, 5);
  });

  $("#txtSeconds").focus(function(){
    $(this).val('');
  });
  $("#txtSeconds").keyup(function(event) {
    d = 0.37;
    setInterval(calculate, 5);
  });

Answer 1

你缺少css，在你的脚本中，你正在设置一个类twitter-share-button的链接，你需要一个包含该类的样式表。您可能已经知道如何将CSS表链接到HTML中，但这是一个示例：这介于<head>

之间

 <link href="controls/ControlStyles.css" rel="stylesheet" type="text/css" />

编辑：

确保它在您的HTML中，如Twitter Docs

<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

根据您希望按钮的外观，有不同的<script>标记选项，如果可能，我仍会尝试将该样式合并到您自己的服务器上

Answer 2

在Twitter's examples的所有内容中，加载的脚本位于<a>标记标记之后。这是可能的，因为您首先加载脚本它可能正在立即执行，而不是响应DOMContentReady事件，因此找不到任何要创建的按钮。在添加标记后尝试包含脚本。或者尝试使用Twitter的非jQuery代码。

JavaScript Twitter按钮代码不起作用

2 个答案: