0

我有一个滑块，它处理从该幻灯片中获取数据的图像和变量集。我操纵这些数据来创建某些功能。

我目前有一组图像可以在我的页面主体上移动（滑块）我有一个始终固定在页面右侧的社交栏。

我要做的是抓取数据并更改 url，每次使用滑块提供的回调函数更改幻灯片时，社交按钮内的文本。这是我的代码：

var $mainContainer = $('div#container');
  var $tmbContainer = $('.rsThumbsContainer');
  var $tmbContainerT = $('.rsThumbsContainer').find('.rsThumb');
  var $slider = $('#gallery-t-group');
  var $body = $('body');
  var $close = $('<div id="close"><p class="icon-close"></p></div>');        

$tmbContainerT.each(function () {
      //console.log(slider.currSlide);
        $(this).on('click', function(event) {       
            $('body').addClass('rsSlider-active');
            sliderR();
            var $gallery = $('#gallery-t-group').find('.portfolio');

            $gallery.each(function () {
                var src = this.href;
                var content = $(this).find('.perma_link').val();
                var textContent = $(this).find('img').attr('alt'); // same as $(this.element).attr("title"); before you modify it using this.title +=
                var image = $(this).find('img').attr('src'); // this is the URL of the thumbnail
                var imageAlt = $(this).find('img').attr('alt');
                var $tumbl = $(this).find('a.tumbl-button');
                $tumbl.attr("href","http://www.tumblr.com/share/photo?source="+ encodeURIComponent(image) +"&caption="+ encodeURIComponent(textContent) +"&clickthru="+ encodeURIComponent(content) +"");

                slider.ev.on('rsAfterSlideChange', function(event) {
                $('#twit').html('<div id="twitter" data-url="'+content+'" data-text="'+textContent+'"></div>');
            $('#twitter').attr("data-url",content);
            $('#twitter').attr("data-text",textContent);
            $('#twitter').sharrre({
                    share: {
                        twitter: true
                    },
                    template: '<a class="box" href="#"><div class="count" href="#">{total}</div><div class="share"><span></span>Tweet</div></a>',
                    enableHover: false,
                    enableTracking: true,
                    buttons: { twitter: {via: '_JulienH'}},
                    click: function(api, options){
                        api.simulateClick();
                        api.openPopup('twitter');
                    }
                });
            });

            });
            slider.updateSliderSize(true);
        });

      });

这是添加我所有社交按钮的地方：

<div class="socialbar-vertical">
<div id="socio-box">
<div id="twit"></div>
  <div id="facebook" data-url="http://sharrre.com/" data-text="Make your sharing widget with Sharrre (jQuery Plugin)"></div>
  <div id="googleplus" data-url="http://sharrre.com/" data-text="Make your sharing widget with Sharrre (jQuery Plugin)"></div>
</div>
</div>

目前，这就是我改变 div 内容的全部内容，但它始终使用第一个单击的 div：

$('#twit').html('<div id="twitter" data-url="'+content+'" data-text="'+textContent+'"></div>');

我想做的是在每次幻灯片更改时不断更改该 div 的属性。

我在这里做错了什么还是错过了一个技巧？

4

1 回答 1

0

a.) 为什么不只在替换 div 之前存储 #twit.attr，然后在替换后分配值。

//Make a copy of all attributes of #twit
//TODO Replace #twit
//TODO set all attributes to the new #twit

b.）另一种选择是完全停止替换#twitter，而是重新使用它（包括它的孩子）。可能会减少资源消耗。

于 2013-07-16T14:38:18.620 回答