Twitter按钮不会正常发送消息 [英] Twitter button not tweeting properly

问题描述

我有一个随机报价生成器（

我没有正确链接我的报价，我假设在我的函数中。对于JavaScript的新手来说，很难说出什么。我已经在这方面进行了广泛搜索，似乎无法找到解决方案。

我的HTML：

 < div class =row> 
< div class =col-12 buttons> 
< a class =twitter-share-buttonhref =http://twitter.com/sharetarget =_ blank>< button type =buttonclass =btn btn- outline-dangeronclick =tweetIt（）>< i class =fa fa-twitteraria-hidden =true>< / i>< / button>< / a> 
< button type =buttonclass =btn btn-outline-dangeronclick =newQuote（）>引用< / button> 
< / div> 
< / div> 
 
< div class =row> 
< div class =col-12> 
< div id =quoteDisplayclass =writing> 
 <！ - 此处引用 - > 
< / div> 
< / div> 
< / div> 
  

我的JavaScript：

  var quotes = [
没有什么可写的，你所做的只是坐在打字机上流血。，
聪明人的幸福是我认识的最稀罕的事情，
世界打破了每个人，之后，一些人在破碎的地方变得坚强起来。 
] 
 function newQuote（）{
 var randomNumber = Math.floor（Math.random（）*（quotes.length））; 
 document.getElementById（'quoteDisplay'）。innerHTML = quotes [randomNumber]; 
}; 
 
 $（。twitter-share-button）。click（function（）{
 $（this）.attr（href，'https://twitter.com/ intent / tweet？text ='+ randomNumber）; 
}）; 
  

解决方案

您的代码中使用的链接是在< a> 标记中。

你不想那样。该链接没有数据被传入，因此twitter默认URL为 twitter.com/intent/tweet?url=&original_referer = ，这会将文本生成为URL你来自。 （在你的情况下，这是你的本地）。

没有必要包装twitter 按钮和< a> c标签，因为你正在使用 oncick（）函数。

你试图完成什么。

首先修改您的 HTML ，如下所示：

 < div class =row> 
< div class =col-12 buttons> 
< button type =buttonclass =btn btn-outline-dangeronclick =tweetIt（）> Tweet< / button> 
< button type =buttonclass =btn btn-outline-dangeronclick =newQuote（）>引用< / button> 
< / div> 
< / div> 
 
< div class =row> 
< div class =col-12> 
< div id =quoteDisplayclass =writing> 
 <！ - 此处引用 - > 
< / div> 
< / div> 
< / div> 
  

您的 .js 应该看起来像这样：

  var quotes = [
没有什么可写的。坐在打字机旁边流血。，
聪明人的幸福是我所知道的最稀罕的事情。，
世界打破了每个人，之后，一些人在破碎的地方变得坚强起来。  
] 
 function newQuote（）{
 var randomNumber = Math.floor（Math.random（）*（quotes.length））; 
 document.getElementById（'quoteDisplay'）。innerHTML = quotes [randomNumber]; 
}; 
 
函数tweetIt（）{
 var randomNumber = Math.floor（Math.random（）*（quotes.length））; 
 window.open（https://twitter.com/intent/tweet?text=+ quotes [randomNumber]）; 
} 
  

I have a Random Quote Generator (http://codepen.io/anon/pen/wgqWgo) and when trying to tweet a quote, I get the following result:

I am not linking my quote correctly I assume in my function. Being new to JavaScript it is hard to tell what though. I have searched extensively on this and can't seem to find a solution.

My HTML:

<div class="row">
                    <div class="col-12 buttons">
                        <a class="twitter-share-button" href="http://twitter.com/share" target="_blank"><button type="button" class="btn btn-outline-danger" onclick="tweetIt()"><i class="fa fa-twitter" aria-hidden="true"></i></button></a>
                        <button type="button" class="btn btn-outline-danger" onclick="newQuote()">Quote</button>
                    </div>
                </div>

  <div class="row">
                    <div class="col-12">
                        <div id="quoteDisplay" class="writing">
                            <!-- Quotes here -->
                        </div>
                    </div>
                </div> 

My JavaScript:

var quotes = [
    "There is nothing to writing. All you do is sit down at a typewriter and bleed.",
    "Happiness in intelligent people is the rarest thing I know.",
    "The world breaks everyone, and afterward, some are strong at the broken places."
]
function newQuote() {
    var randomNumber = Math.floor(Math.random() * (quotes.length));
    document.getElementById('quoteDisplay').innerHTML = quotes[randomNumber];
};

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

解决方案

The link that is being used in your code, is the one in the <a> tag.

You don't want that. That link has no data being passed in, therefore twitter is defaulting the URL as twitter.com/intent/tweet?url=&original_referer= which produces the text as the URL you are coming from. (In your case it's your local).

There's no need to wrap the twitter button an the <a> tag since you are using the oncick() function.

The following code seems to do what you are trying to accomplish.

First modify your HTML as follows:

<div class="row">
                    <div class="col-12 buttons">
                         <button type="button" class="btn btn-outline-danger" onclick="tweetIt()">Tweet</button>
                        <button type="button" class="btn btn-outline-danger" onclick="newQuote()">Quote</button>
                    </div>
                </div>

  <div class="row">
                    <div class="col-12">
                        <div id="quoteDisplay" class="writing">
                            <!-- Quotes here -->
                        </div>
                    </div>
                </div> 

And your .js should look like this:

var quotes = [
    "There is nothing to writing. All you do is sit down at a typewriter and bleed.",
    "Happiness in intelligent people is the rarest thing I know.",
    "The world breaks everyone, and afterward, some are strong at the broken places."
]
function newQuote() {
    var randomNumber = Math.floor(Math.random() * (quotes.length));
    document.getElementById('quoteDisplay').innerHTML = quotes[randomNumber];
};

function tweetIt(){
var randomNumber = Math.floor(Math.random() * (quotes.length));
window.open("https://twitter.com/intent/tweet?text=" + quotes[randomNumber]);
}

这篇关于Twitter按钮不会正常发送消息的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！