如何动态添加“pin it”按钮？

Question

我正在尝试优化我的Wordpress安装 - 我看到的其中一个罪魁祸首是 Pinterest 的“ Pin It ”按钮小部件。我现在正试图找到一种方法来动态加载JS代码（当它们最初悬停在按钮上时），然后将其应用到页面。到目前为止，我只能做到这一点：

jQuery(document).on("mouseenter click",'.pinItSidebar', function() {
    jQuery.getScript("http://assets.pinterest.com/js/pinit_main.js", function() {
        // do something here?
    });
});

我似乎无法找到一个我可以调用的函数（作为一个回调，在加载JS之后）。显然我每页只会加载一次（上面只是一个非常基本的版本）

有没有人对如何实现这一点有任何建议？我希望它如何运作的最终游戏是：

工作解决方案：

这是我现在得到的一个有效的解决方案，只有当他们点击按钮时才能加载pinterest东西（然后再触发开启者）。这背后的想法是，它节省了大量的Pinterest JS / CSS / onload调用，这减慢了页面的速度。

jQuery(document).on("click",'.pinItSidebar', function() {
    if (typeof PinUtils == "undefined") {
        jQuery.getScript("http://assets.pinterest.com/js/pinit_main.js", function() {
            PinUtils.build();
            PinUtils.pinAny();
        });
    } else {
        PinUtils.pinAny();
    }
});

...只需致电：

<a href="javascript:void(0);" class="pinItSidebar">foo</a>

希望这有助于节省其他人一些时间:)

额外调整：我只是在玩，看看我是否能让它更加出色:)基本上，我希望能够决定哪些图像是可以固定的。在下面这将为您做到这一点：

jQuery("img").each(function() {
    if (jQuery(this).data('pin-do')) {
        // its ok, lets pin
    } else {
       jQuery(this).attr('nopin',"1");
    }
});

要使图像固定，您需要做的就是让data-pin-do="1"参数设置您想要分享的图像：）