0

http リクエストが成功するたびに、新しいボタンを ajax しています。

//Remove events and items
$('#sthoverbuttons-chicklets span').remove();

次に、オブジェクトを stwidget に渡して、新しいイベントを含む新しい項目を追加します。

sharethis のドキュメントを参照してください: http://support.sharethis.com/customer/portal/articles/475079-share-properties-and-sharing-custom-information#Dynamic_Specification_through_JavaScript

//Finish with share buttons
wyrAjax.sharethis.finishAddingShareButton();

wyrAjax.sharethis = {
//Grab the current share height so we can keep it this height when we remove all the items
    shareThisHeight:null,
    init:function () {

        //If the height has not been set set it
        if(wyrAjax.sharethis.shareThisHeight===null){
            wyrAjax.sharethis.shareThisHeight = $('#sthoverbuttons').outerHeight();
        }

        //Set up elements so that we can use them as ID's
        $('.sthoverbuttons-chicklets').attr('id', 'sthoverbuttons-chicklets');
        if (!$('#shareLoading').length) {
            $('#sthoverbuttonsMain').append('<div id="shareLoading"><img src="/img/loading.gif" style="position: absolute; top: 50%;left: 37%"></div>');
        }
    },
    shareTypes:function(){
        var array = [];
        array[0]={
            "service":"facebook"
        };
        array[1]={
            "service":"twitter"
        };
        array[2]={
            "service":"delicious"
        };
        array[3]={
            "service":"googleplus"
        };
        array[4]={
            "service":"reddit"
        };
        array[5]={
            "service":"tumblr"
        };
        array[6]={
            "service":"stumbleupon"
        };
        array[7]={
            "service":"digg"
        };
        array[8]={
            "service":"sharethis"
        };
        return array;
    },
    startGettingShareButton:function () {
        //First we run a quick check to see if the elemnts have ID's
        wyrAjax.sharethis.init();

        //Now lets fade out and clean up all the shares so we can add new shares in.
        $('#sthoverbuttons-chicklets').hide();

        $('#sthoverbuttonsMain').height(wyrAjax.sharethis.shareThisHeight);
        wyrAjax.sharethis.addLoadingToShare();
    },
    addLoadingToShare:function () {
        $('#shareLoading').show();
        $('#sthoverbuttons-chicklets span').off().remove();
    },
    finishAddingShareButton:function () {
        $('#shareLoading').hide();
        var shareItems = wyrAjax.sharethis.shareTypes();
        $.each(shareItems,function(key, value){
            wyrAjax.sharethis.addShareThisButton(value);
        });
        $('.sthoverbuttons-chicklets').show();
    },
    addShareThisButton:function (object) {
        stWidget.addEntry({
            "service":object.service,
            "element":document.getElementById('sthoverbuttons-chicklets'),
            "url":"http://www.wouldyourathers.co.uk/question/" + wyrAjax.questionDetails.id,
            "title":"Would You Rather | " + wyrAjax.questionDetails.q1,
            "type":"large",
            "text":"Would You Rather " + wyrAjax.questionDetails.q1 + " or " + wyrAjax.questionDetails.q2,
            "summary":wyrAjax.questionDetails.q1 + " or " + wyrAjax.questionDetails.q2
        });
    }
};

新しく追加されたボタンの 1 つをクリックすると、たとえば twitter の共有機能に移動しますが、何らかの理由で Facebook の共有も表示されます。

再度追加する前に、スパン上のすべてのイベントを削除したいと考えています。

4

1 に答える 1

0

だから私が抱えていた問題は、sharethisが共有アイテムを削除したくないということです。SharethisstWidget.addEntryは、新しいdomアイテムを追加することを望んでおらず、ページに既に存在する現在の共有ボタンを置き換えることを望んでいます。

これを念頭に置いて、コードを編集して、すでに共有されているすべてのボタンにIDを追加しました。

 //Give all share buttons ID's
 var shareItems = wyrAjax.sharethis.shareTypes();
 $.each(shareItems,function(key, value){
   $('.st_'+value.service+'_large').attr('id','st_'+value.service+'_large');
 });

次に、Sharethisを使用addEntryして、既存のボタンを置き換えました。

wyrAjax.sharethis = {
    //Grab the current share height so we can keep it this height when we remove all the items
    shareThisHeight:null,
    init:function () {

        //If the height has not been set set it
        if(wyrAjax.sharethis.shareThisHeight===null){
            wyrAjax.sharethis.shareThisHeight = $('#sthoverbuttons').outerHeight();
        }

        //Set up elements so that we can use them as ID's
        $('.sthoverbuttons-chicklets').attr('id', 'sthoverbuttons-chicklets');
        if (!$('#shareLoading').length) {

            //Give all share buttons ID's
            var shareItems = wyrAjax.sharethis.shareTypes();
            $.each(shareItems,function(key, value){
                $('.st_'+value.service+'_large').attr('id','st_'+value.service+'_large');
            });

            $('#sthoverbuttonsMain').append('<div id="shareLoading"><img src="/img/loading.gif" style="position: absolute; top: 50%;left: 37%"></div>');
        }
    },
    shareTypes:function(){
        var array = [];
        array[0]={
            "service":"facebook"
        };
        array[1]={
            "service":"twitter"
        };
        array[2]={
            "service":"delicious"
        };
        array[3]={
            "service":"googleplus"
        };
        array[4]={
            "service":"reddit"
        };
        array[5]={
            "service":"tumblr"
        };
        array[6]={
            "service":"stumbleupon"
        };
        array[7]={
            "service":"digg"
        };
        array[8]={
            "service":"sharethis"
        };
        return array;
    },
    startGettingShareButton:function () {
        //First we run a quick check to see if the elemnts have ID's
        wyrAjax.sharethis.init();

        //Now lets fade out and clean up all the shares so we can add new shares in.
        $('#sthoverbuttons-chicklets').hide();

        $('#sthoverbuttonsMain').height(wyrAjax.sharethis.shareThisHeight);
        wyrAjax.sharethis.addLoadingToShare();
    },
    addLoadingToShare:function () {
        $('#shareLoading').show();
    },
    finishAddingShareButton:function () {
        //Remove the loading.gif
        $('#shareLoading').hide();

        //grab array of different share types
        var shareItems = wyrAjax.sharethis.shareTypes();

        //Loop through 
        $.each(shareItems,function(key, value){
            wyrAjax.sharethis.addShareThisButton(value);
            $('#st_'+value.service+'_large > span:first-child').remove();
        });
        $('.sthoverbuttons-chicklets').show();
    },
    addShareThisButton:function (object) {
        stWidget.addEntry({
            "service":object.service,
            "element":document.getElementById('st_'+object.service+'_large'),
            "url":"http://www.wouldyourathers.co.uk/question/" + wyrAjax.questionDetails.id,
            "title":"Would You Rather | " + wyrAjax.questionDetails.q1,
            "type":"large",
            "text":"Would You Rather " + wyrAjax.questionDetails.q1 + " or " + wyrAjax.questionDetails.q2,
            "summary":wyrAjax.questionDetails.q1 + " or " + wyrAjax.questionDetails.q2
        });
    }
};

うまくいけば、誰かがこれが役立つと思うでしょう。

于 2012-07-19T22:48:17.727 に答える