Question

我正在尝试找到一种方法（JQuery等）自动更新用于在Facebook，Twitter等上共享的URL。

例如：

<a href="https://www.facebook.com/sharer/sharer.php?u=http//xxxxxxxxx.co.uk/index.html/" class="button button--icon button--facebook"><img src="../img/facebook.png"></a>

除非我想用某些内容替换“http // xxxxxxxxx.co.uk”，否则如果要更改该页面的网址，它会获取该网址并将其插入标记中，而无需我更新手动？

Answer 1

您只是想从当前页面的网址动态构建此href吗？像这样的东西？：

document.getElementById('yourAnchorElement').href =
    'https://www.facebook.com/sharer/sharer.php?u=' +
    encodeURIComponent(window.location.href);

它只获取当前URL，对其进行URL编码以用作查询字符串参数，将其附加到已知的基本URL，并将其设置为元素的href。

您不需要来使用document.getElementById()，您用来识别目标元素的任何方法都可以。

Answer 2

使用jQuery，您可以在document.ready上执行以下操作：

这是一个jsFiddle demo

$(function () {

   var fbShare = 'https://www.facebook.com/sharer/sharer.php?u='
   // grab url of the page:
   var url = window.location;

    // loop through all elements with class 'button--facebook' and update href:
    $('.button--facebook').each(function () {
         $(this).attr('href', fbShare + url);
    });

});

Answer 3

这是一个用jQuery生成共享按钮的小函数。

<强> HTML

<div id="fb"></div>

<强>的jQuery

var fblink = "https://www.facebook.com/sharer/sharer.php?u={{link}}";

$(document).ready(function () {
    generateLink('fb','http://www.google.com');
    generateLink('fb','http://www.stackoverflow.com');
});

function generateLink(id,link) {
    $('#' + id).append('<a href="' + fblink.replace('{{link}}',link) + '">Share</a>');
}

JSFiddle

我在JSFiddle中使用“分享”替换了您的图像，无法访问您的图像，但可以根据您的需要进行替换。

用于在Facebook，Twitter等上共享URL的锚标签

3 个答案: