在 sharrre Jquery 中动态更改 url答案

【问题标题】：Dynamically changing url in sharrre Jquery在 sharrre Jquery 中动态更改 url
【发布时间】：2016-01-06 07:30:29
【问题描述】：

我的问题如下：

我的页面上有多个过滤器，这些过滤器事件会动态安排，因此当我单击任何过滤器时，我的网址会更改而无需重新加载页面。

例如：

http://.../schedule/#Screening,Free

http://.../schedule/#Talk,Expo

然后，我与 Sharrre 共享按钮：

    .social.social--share-filters
        a.icon.icon-twitter.js-twitter-filters(href="#", target="_blank")
        a.icon.icon-linkedin2.js-linkedin-filters(href="#", target="_blank")
        a.icon.icon-facebook.js-facebook-filters(href="#", target="_blank")

  $('.js-facebook-filters').sharrre({
share: {
  facebook: true,
},
url: window.location.href,
enableTracking: false,
enableHover: false,
click: function(api, options) {
  api.simulateClick();
  api.openPopup('facebook');
}
  });

尽管在 sharrre 内部我有 url 变量等于当前链接，但它只共享第一次加载页面时派生的链接。

我试图把它放在图标上的点击事件中——这不起作用。我试图将 sharrre 放在一个函数中（例如，initialiseShare）并执行window.initialiseShare = initialiseShare; - 这也不起作用。而且我尝试删除并附加按钮，更改 data-url 属性，它也不起作用。

function initialiseShare(link) { 
   $('.js-twitter-filters').sharrre({
    share: {
      twitter: true,
    },
    enableTracking: false,
    enableHover: false,
    click: function(api, options) {
      api.simulateClick();
      api.openPopup('twitter');
    }   }); }

$(document).ready(function() {
    initialiseShare();
    $('.js-twitter-filters').on('click', function(){
        var clone = $('.js-twitter-filters').clone();
        $('.js-twitter-filters').remove();
        $('.social--share-filters').append(clone);
        $('.js-twitter-filters').data('url', window.location.href);
        initialiseShare();
        return false;
    });
});

玉为图标

    .social.social--share-filters
        a.icon.icon-twitter.js-twitter-filters(href="#", target="_blank" data-url="#")

请帮忙！

提前谢谢你！

附：除了可能导致无法在设计中自定义的按钮之外，我可以使用任何其他解决方案。

【问题讨论】：

所以解决方案是重置按钮，而不是在它们的点击事件期间，而是在处理过滤器上的点击事件期间。

标签： javascript jquery filtering sharing

【解决方案1】：

试试这个：

$('body').on('DOMNodeInserted', '.js-twitter-filters', function(e) {
  $(this).sharrre({
    share: {
      twitter: true,
    },
    enableTracking: false,
    enableHover: false,
    click: function(api, options) {
      api.simulateClick();
      api.openPopup('twitter');
    }
  });
});

说明：

您正在尝试绑定到动态加载的元素。当您的脚本在页面加载时执行时，jQuery 无法使用这些元素来执行与“sharrre”的绑定 - 因此您可以使用 .on() 实时绑定委托在插入后绑定到元素。

参考：

http://api.jquery.com/on/

【讨论】：