Twitter düğmesi birden çok düğme oluşturuyor

Question

Sitemdeki (http://conn3cted.uk.tn/quote.html) Twitter'da createShareButton kullanıyorum ama her zaman 'Yeni Alıntı' düğmesine basıldığında, birden çok düğmeyle beni bırakarak yeni bir twitter düğmesi oluşturuluyor (örn. 'Yeni Alıntı' düğmesine 10 kez basıldığında, 10 adet paylaşım düğmesi olacak).

Birkaç gün önce gayet iyi çalışıyordu, bu yüzden ne olduğunu anlayamadık. böylece her zaman .regenButtongetQuote denir, tıklandığında, sana başka bir düğmeye vererek -

// Random Quote Generator 
$(document).ready(function() { 
    // Set the default values for future AJAX requests 
    $.ajaxSetup({ 
    // Prevent all future AJAX requests from being cached. 
    cache: false 
    }); 
    // API URL 
    var quoteURL = "http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1"; 
    // getQuote function, which accepts a data parameter. 
    var getQuote = function(data) { 
    // Replace the html of the targeted element with the returned content field. 
    $(".quoteContent").html(data[0].content); 
    // Replace the html of the targeted element with the returned title field. 
    $(".quoteTitle").html('Author: ' + data[0].title); 
    newColor(); 

    twttr.ready(function() { 
     // Use the pre-made createShareButton function 
     twttr.widgets.createShareButton(
      // Do not share a URL 
      " ", 
      // Div where the share button should be inserted 
      document.getElementById('tweetButton'), 
      { 
       // Define the tweet that will be used 
       text: "'" + $(".quoteContent").text().replace(/(\r\n|\n|\r)/gm,"") + "'\n" + 
       $(".quoteTitle").text(), 
       // Set the size of the Twitter share button 
       size: "large", 
      } 
     ); 
    }); 
    }; 

    var newColor = function() { 
    var color = Please.make_color(); 
    $("body, button, .btn").css("background-color",color); 
    $("p, blockquote").css("color",color); 
    }; 

    /* 
    * On every page load get JSON data from the URL, defined in the 
    * 'url' variable, and then run the getQuote function 
    */ 
    $.getJSON(quoteURL, getQuote); 
//newColor(); 

/* 
    * When the button is clicked load get JSON data from the * URL,defined in the 'url' variable, and then run the 
    * getQuote function. 
    */ 
    $(".regenButton").click(function() { 
    $.getJSON(quoteURL, getQuote); 
    }); 


}); 

Answer 1

Bu, $.getJSON başarı geriçağırımınızda twitter düğmesini oluşturduğunuzdan. Yani bir teklif yüklendiğinde, bir twitter düğmesi oluşturulur.

En iyi çözüm, düğmeyi bir kez oluşturmak ve her teklifin yüklendiği her paylaşım metnini güncellemek olacaktır. Hangi dokümanlar içinde bulamıyorum. Öyleyse benim en iyi tahminim önce bir tane önce silmek:

var getQuote = function(data) { 
    // Replace the html of the targeted element with the returned content field. 
    $(".quoteContent").html(data[0].content); 
    // Replace the html of the targeted element with the returned title field. 
    $(".quoteTitle").html('Author: ' + data[0].title); 
    newColor(); 

    // remove previous button 
    $('.twitter-share-button').remove(); 

    // and create a new one 
    twttr.ready(function() { 
     // Use the pre-made createShareButton function 
     twttr.widgets.createShareButton(
      // Do not share a URL 
      " ", 
      // Div where the share button should be inserted 
      document.getElementById('tweetButton'), 
      { 
       // Define the tweet that will be used 
       text: "'" + $(".quoteContent").text().replace(/(\r\n|\n|\r)/gm,"") + "'\n" + 
       $(".quoteTitle").text(), 
       // Set the size of the Twitter share button 
       size: "large", 
      } 
    ); 
    }); 
}; 

Answer 2

Kişisel twitter paylaş düğmesi kodu getQuote işlevi içinde aşağıda

Benim JavaScript'tir.

Answer 3

Bu gönderiye giren herkes için; Bunu biraz daha araştırıyordum ve Twitter Widget'ı kullanmadan Twitter Share butonunu oluşturmanın bir yolunu keşfettim.

Önce sağ ok ...

/* 
* Amend the "href" attribute of the element with a "tweetButton" class 
* (the "a" tag) to take the twitterURL Global Variable, plus the parameter 
* "text=" (which specifies what the tweet will say) and assign the value of: 
* 
* - the element with a class of "quoteContent", without the HTML tags 
* (.text()), removing all line breaks (.replace(/(\r\n|\n|\r)/gm,"")), 
* trims all the white space (.trim()) 
* 
* - adds a line break (\n) 
* 
* - the element with a class of "quoteTitle", without the HTML tags 
* (.text()) 
* 
* Then URL encode the result (encodeURIComponent) to complete the amendment 
*/ 
$(".tweetButton").attr("href", twitterURL + "text=" + encodeURIComponent("'" + 
    $(".quoteContent").text().replace(/(\r\n|\n|\r)/gm,"").trim() + 
    "'\n" + $(".quoteTitle").text()));