0

我有这样的结构,我正在使用Share-Button

<div class="video-snap">
  <div class="video-content">All the content is here</div>
  <div class="share-button" data-url="video1">
</div>
<div class="video-snap">
  <div class="video-content">All the content is here</div>
  <div class="share-button" data-url="video2">
</div>

我需要每个共享按钮共享数据字段上指示的数据 URL。我想出了这个,但结果是即使在控制台上,每个都很好(我正确获取了所有 url)分配给按钮的 URL 始终是最后一个 video-snap 元素(所有都将转到 video2 url这个例子)

$(window).load(function() {
    $('.video-snap').each(function() {
        var url = $('.share-button', this).data('url');
        console.log(url);
        config = {
            networks: {
                facebook:{
                    url: url
                },
                google_plus:{
                    url: url
                },
                twitter:{
                    url: url
                },
                pinterest:{
                    enabled: false
                },
                email:{
                    enabled: false
                }

            }   
        }
        new Share('.share-button', config)

    }); 
});

我正在寻找但无法实现的是每个共享按钮都有自己的网址。不知道我做错了什么,因为我正在使用每个功能。

4

1 回答 1

1

在实例化新共享时使用.each()索引来个性.share-button化,问题是两者div.video-snapshare-button无法区分它们。

HTML

<div class="video-snap">
    <div class="video-content">All the content is here</div>
    <div class="share-button share-0" data-url="video1">
</div>
<div class="video-snap">
    <div class="video-content">All the content is here</div>
    <div class="share-button share-1" data-url="video2">
</div>

JS - 将索引添加到每个.share-button

$(document).ready(function(){

    $('.video-snap').each(function(index){
        $(".share-button", this).addClass('share-' + index);
        config = { url: $('.share-button', this).data('url') }
        new Share('.share-' + index, config);
    });

});
于 2014-08-20T20:01:08.657 回答