使用jQuery更新sharethis chicklet按钮的st_url属性?

时间:2011-05-10 23:36:10

标签: javascript jquery sharethis

我正在动态更新所有sharethis span的属性'st_url'到用jQuery点击的视频的url。在firebug中你可以看到它正在更新我的跨度的st_url属性,但是我的sharethis按钮仍然绑定到初始url。我读过我可能需要重新启动这些元素,但我不确定最好的方法吗?有没有人这样做或有任何想法用更新的URL重新初始化按钮的最佳方法?谢谢!

Sharethis包括和init:

<script type="text/javascript">
    var switchTo5x=true;
</script>
<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript">
    stLight.options({publisher:'xxxx'});
</script>

我的标记:

<span st_url="http://sharethis.com" class='st_stumbleupon' ></span>
<span st_url="example" class='st_facebook' ></span>
<span st_url="example" class='st_twitter' ></span>
<span st_url="example" class='st_email' ></span>

我的jQuery在用户点击视频时更新attr =“st_url”:

//note: this is triggered by .bind('click')
var youtubeID = $(this).attr('id');
$('#container div > span').each(function(){
    //update sharethis to current video
    $(this).attr('st_url','http://www.youtube.com/watch?v=' + youtubeID);
});

4 个答案:

答案 0 :(得分:4)

这是我项目的代码。希望,你可以使用它。

// define attributes for buttons
settings.share_buttons = [
    ['facebook','st_facebook_large','Facebook','Share on Facebook'],
    ['twitter','st_twitter_large','Tweet','Share on Twitter'],
    ['pinterest','st_pinterest_large','Pinterest','Share on Pinterest'],
    ['linkedin','st_linkedin_large','LinkedIn','Share on LinkedIn'],
    ['googleplus','st_googleplus_large','Google +','Share on Google +'] 
]; //[service,class,displayText,title]

// all code under could be placed into a function and bind on a click event 
// (don't forget about variable with URL, 'our_link_to_share').

//if block with buttons already exists
if (document.getElementById('share_this_id')){
    $('#share_this_id' > span').each(function(){
     $(this).removeAttr('st_url').attr('st_url',our_link_to_share).empty();
        stWidget.addEntry({
            "service":$(this).prop('service'),
            "element":this,
            "url":$(direct_link).prop('value'),
            "title":$(this).prop('title'),
            "type":"large",
            "text":$(this).prop('displayText'),
            "image":"http://www.softicons.com/download/internet-icons/social-superheros-icons-by-iconshock/png/256/sharethis_hulk.png",
            "summary":"My site"
        });
    });
}// if not, we'll create it
else{
    $('body').append($('<div>').prop('id', share_this_id).prop('class', 'share_this'));
    var share_this = document.getElementById('share_this_id');
    for(i=0; i&ltsettings.share_buttons.length; i++){
        $(share_this).append($('<span>').attr('st_url', our_link_to_share).prop('class', settings.share_buttons[i][1]).prop('displayText', settings.share_buttons[i][2]).prop('title', settings.share_buttons[i][3]).prop('service', settings.share_buttons[i][0]));
    }
}
if (stButtons){stButtons.locateElements();},

答案 1 :(得分:3)

因为在ShareThis中没有updateEntry调用,所以你需要使用jQuery的.html()来重新创建容器内的元素,然后使用针对span的ID的stWidget.addEntry单独调用来重新填充每个元素。

答案 2 :(得分:1)

在通过ajax加载新页面后,我使用以下代码段重新初始化ShareThis按钮。只需确保添加您的发布商密钥:

$.ajax({  
    url: 'http://w.sharethis.com/button/buttons.js',  
    dataType: 'script',  
    success: function(){  
    stLight.options({  
    publisher: 'xxx',  
    onhover: false  
    });  
    },  
    cache: true  
});  

在搜索了很长时间以获得良好解决方案之后,我最初在下面链接的位置找到了代码段。在此处重新发布,因为它被埋藏在大量其他过于复杂的代码中:http://forums.sharethis.com/topic.php?id=3937#post-84933

答案 3 :(得分:0)

最终我也最终改写了整个街区。我这样做了

<div id="share-buttons">
    <button>custom stuff</button>
</div>

<div id="share-template" style="display:none">
    <span class='st_facebook_large' displayText='Facebook'></span>
    <span class='st_twitter_large' displayText='Twitter' st_via="Myself"></span>
    <span class='st_linkedin_large' displayText='LinkedIn'></span>
    <span class='st_email_large' displayText='Email'></span>
</div>

每次分享的网址都发生了变化:

var url=newurl, title = newtitle;
$('#share-buttons > span.st_dynamic').remove();
$('#share-template > span').empty().unbind().removeAttr('st_processed').each(function(){
    $(this).clone().prependTo('#share-buttons')
        .attr('st_url',url)
        .attr('st_title',title)
        .addClass('st_dynamic');
});
if (window.stButtons) stButtons.locateElements();

所有空()。unbind.removeCrap()似乎是必要的。还需要重置st_title - 它被缓存在某个地方。

YMMV,特别是因为buttons.js是外部的,这个未记录的东西改变了: - /