我正在构建一个随机报价机器。我有一个推文按钮来分享报价。它可以工作,但只有在我首先点击“生成报价”按钮之后。如果我在加载页面后直接点击“推特” - 它不起作用。
我知道它正在发生,因为我的$(".twitter-share-button").attr("href", "https://twitter.com/intent/tweet?text=" + thisQuote);
代码在$("#gen").on("click", function(){
内,但我不知道如何在此函数之外删除它。
当我将它放在外面时它不起作用,因为thisQuote
var的值在$("#gen").on("click", function(){
当我尝试将所有代码放在$("#gen").on("click", function(){
之前它停止工作时。
在这种情况下如何正确订购功能?
我的笔:http://codepen.io/s4ek1389/pen/zZGNWw?editors=1010
$(document).ready(function(){
var thisQuote = "";
$("#gen").on("click", function(){
$.getJSON("http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&callback=", function(json) {
var author = "";
var quote = "";
$.ajaxSetup({cache:false});
json.forEach(function(val){
author+= val.title;
quote+= val.content;
var shortQuote = quote.slice(3,-5);
thisQuote = shortQuote + " - " + author;
$("#author").html(author);
$("#mainquote").html(quote);
})
$(".twitter-share-button").attr("href", "https://twitter.com/intent/tweet?text=" + thisQuote);
});
});
});
答案 0 :(得分:1)
您必须在页面加载完毕后检索随机引用,而不是仅在单击按钮时检索。
我已经制作了一个单独的方法,因此更容易阅读和维护。
试试这个:
$(document).ready(function () {
var thisQuote = "";
getRandomQuote();
$("#gen").on("click", function () {
getRandomQuote();
});
function getRandomQuote() {
$.getJSON("http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&callback=", function (json) {
var author = "";
var quote = "";
$.ajaxSetup({ cache: false });
json.forEach(function (val) {
author += val.title;
quote += val.content;
var shortQuote = quote.slice(3, -5);
thisQuote = shortQuote + " - " + author;
$("#author").html(author);
$("#mainquote").html(quote);
})
$(".twitter-share-button").attr("href", "https://twitter.com/intent/tweet?text=" + thisQuote);
});
}
});
CodePen:
答案 1 :(得分:1)
您可以在第一时间触发点击,将href分配到"推文按钮"
$("#gen").trigger("click");
http://codepen.io/sassoli/pen/yMJWZo
如果你需要从威廉·莎士比亚的默认句子开始,你可以添加这个
http://codepen.io/sassoli/pen/OpXYGM
$(".twitter-share-button").attr("href", "https://twitter.com/intent/tweet?text=" + $("#mainquote").text()+ " - "+ $("#author").text());