我需要能够按一个按钮在推特上发布报价

Posted 2023-02-25

【中文标题】我需要能够按一个按钮在推特上发布报价

【英文标题】：I need to be able to press a button to tweet out a quote

【发布时间】：2016-03-18 19:27:18

【问题描述】：

我正在尝试编写一个“Tweet this”按钮，该按钮会在 Twitter 上打开一个带有预生成文本的新窗口。我现在得到的是 Twitter 上的一个窗口，上面有我来自哪里的 URL。我正在使用 JQuery API 来执行此操作。我的项目的链接是http://codepen.io/haldav/pen/KVpojP。我的代码是：

$(document).ready(function() 
  random();

function random() 
var quotes = ["You must be shapeless, formless, like water. When you pour water in a cup, it becomes the cup. When you pour water in a bottle, it becomes the bottle. When you pour water in a teapot, it becomes the teapot. Water can drip and it can crash. Become like water my friend.", "Defeat is a state of mind; no one is ever defeated until defeat has been accepted as a reality.", "The moment has no yesterday or tomorrow. It is not the result of thought and therefore has no time.", "Real living is living for others.", "Never waste energy on worries or negative thoughts, all problems are brought into existence -drop them.", "A goal is not always meant to be reached. It often serves simply as something to aim at.", "Those who are unaware they are walking in darkness will never seek the light.", "Because one does not want to be disturbed, to be made uncertain, he establishes a pattern of conduct, of thought, a pattern of relationship to man etc. Then he becomes a slave to the pattern and takes the pattern to be the real thing."];

randomQuote = quotes[Math.floor(Math.random() * quotes.length)];
quote = randomQuote.split("randomQuote");
$('.quote').text(quote[0]);
  

$(".button").on("click", function() 
random();
  );
);

我的 html 代码是：

<div class="text-center" id="jumbotron">
<h1 class="main-text">The Wisdom of Bruce Lee</h1>
<p class="p-text">Although Bruce Lee died at a considerably young age, he was wise beyond his years. For my random quote machine, I chose to showcase some of his wisdom. For this exercise, I used a little JQuery, Bootstrap, CSS and HTML.        </p>
<div class="well">
  <p class="quote" id="tweet"></p>
</div>
<div class="text-center">
  <button class="button" id="quote">New Quote</button>
  <br />
  <a class="twitter-share-button" href="https://twitter.com/intent/tweet/?text=" data-size="large" target="_blank">
  <button type="button" class="btn btn-primary">Tweet this!</button></a>
</div>
<div footer>
  <p class="text-center">Copyright © David C. Hall 2015</p>
</div>

我被难住了。有什么建议？谢谢。 编辑：我要打开一个新窗口，但我需要它在文本框中显示随机引用。

【问题讨论】：

删除超链接中的target="_blank"。

【参考方案1】：

想通了！我所要做的就是添加

$(this).attr("href", 'https://twitter.com/intent/tweet?text=' + randomQuote);

到我的 JS 代码。

【讨论】：

你在哪里添加的？

【参考方案2】：

删除超链接中的target="_blank"。

你的Html应该是

    <div class="text-center" id="jumbotron">
    <h1 class="main-text">The Wisdom of Bruce Lee</h1>
    <p class="p-text">Although Bruce Lee died at a considerably young age, he was wise beyond his years. For my random quote machine, I chose to showcase some of his wisdom. For this exercise, I used a little JQuery, Bootstrap, CSS and HTML.        </p>
    <div class="well">
      <p class="quote" id="tweet"></p>
    </div>
    <div class="text-center">
      <button class="button" id="quote">New Quote</button>
      <br />
<!--changes made here --->
      <a class="twitter-share-button" href="https://twitter.com/intent/tweet/?text=" data-size="large">
      <button type="button" class="btn btn-primary">Tweet this!</button></a>
    </div>
    <div footer>
      <p class="text-center">Copyright © David C. Hall 2015</p>
    </div>

【讨论】：

感谢您的建议，但是当我进行更改时，我得到的只是一个空白页。

你可以尝试

检查 dev.twitter.com/web/javascript/loading 。此链接将帮助您打开弹出小部件，然后打开新标签窗口。

target="_blank" 在 codepen 项目中打开外部链接时是必需的。