动态更改Pin It(Pinterest)按钮的URL

时间:2013-09-12 12:52:25

标签: javascript jquery social-networking pinterest

我目前正在尝试将社交网络的按钮添加到我的网站,但我遇到了Pintesrest的Pin It按钮的问题。我想动态更改引脚的URL但不幸的是,它似乎无法正常工作。我做错了吗?

<script type="text/javascript">
    var urlpin = document.location.href;

    function buildPinUrl(urlpin, urlmedia, description) {
       return '//pinterest.com/pin/create/button/?'+
                'url='+encodeURIComponent(urlpin)+
                '&media='+encodeURIComponent(urlmedia)+
                '&description='+encodeURIComponent(description);
        }

    $(document).ready(function(){
        var urlmedia = $("#stamp1").attr("src");
        var description = $("#title").text();
        var goodurl = buildPinUrl(urlpin, urlmedia, description);

        $('#pinbtn').attr('href', goodurl);

    });

</script>

这里是按钮:

<!-- Pin It Button --><a id="pinbtn" href="//pinterest.com/pin/create/button/?url=http%3A%2F%2Fcollectionnies.com&media=http%3A%2F%2Fcollectionnies.com&description=Next%20stop%3A%20Collectionnies" data-pin-do="buttonPin" data-pin-config="beside"><img src="//assets.pinterest.com/images/pidgets/pin_it_button.png" /></a><!-- Pin It Button -->

感谢您的帮助。

2 个答案:

答案 0 :(得分:1)

有一种更简单的方法可以创建一个pinterest pin-it按钮,用于抓取浏览器栏中的URL:http://youtu.be/5loj1OSdvMs

答案 1 :(得分:0)

使用jQuery 1.6+(达到优势),这很好用:

http://jsfiddle.net/mmKcR/

检查以确保在此代码出现在html之前加载了jQuery。还要确保你没有在noConflict模式下加载jQuery,因为这会打破$的使用。

如果此操作仍然失败,请使用Chrome / Firefox检查器查看任何控制台错误。

如果您看到如下错误:

Uncaught ReferenceError: $ is not defined 

上述两个问题之一是错误的。