0

我正在尝试替换可以在此处设置的通用“保存到foursquare”按钮：https ://foursquare.com/buttons/savetofoursquare

我想用我自己的自定义四方形按钮（Fairhead Creative 的 .svg 版本，由 Zurb 基金会在此处分发：http: //zurb.com/playground/social-webicons）替换它，并且不让脚本自动清除和替换我的自定义按钮带有预先打包的foursquare保存按钮。

我很确定我只需要编写自己的解决方案，使用这里的文档：https ://developer.foursquare.com/overview/widgets - 但我有点困惑。希望那里有例子。

我在一页上还有几个按钮，引用了各种电子名片（多个博物馆位置）。为此，我使用了此处答案中的 data-context 属性：Multiple Foursquare 'save' buttons on one page。这一切都在起作用。

我正在使用我自己的html：

 <span id="venue1-foursquare" class="fc-webicon foursquare" data-context="venue1_vcard">save Venue 1 to foursquare</span>

稍后在页面上：

 <span id="venue2-foursquare" class="fc-webicon foursquare" data-context="venue2_vcard">save Venue 2 to foursquare</span>

这该怎么做？

4

1 回答 1

0

好的，我知道在发布这个问题之前我应该​​继续搜索和修补。:)

感谢 vnads here，我看到了如何设置全局 onReady 功能。我将其设置为使用 jQuery each()，循环遍历 span，获取数据上下文值，然后将功能附加到我的 DOM 元素。这里的关键点来自 vnads 在（当前）接受的解决方案末尾的评论：foursquare 正在寻找一个 DOM 元素，而不是一个 jQuery 对象。

Oh, and the widget.attach() instead of widget.replace() keeps the custom graphic from getting run-over.

<!-- 4Square js: -->
<script type='text/javascript'>
(function() {
    window.___fourSq = {
        "explicit": false,
        "onReady": function () {
            $('.fc-webicon.foursquare').each(function() {
                var this_widget = $(this);
                var this_context = this_widget.data("context");
                var widget = new fourSq.widget.SaveTo({
                    "context": this_context
                });
                widget.attach(this_widget[0]);
            });
        }
    };
    var s = document.createElement('script');
    s.type = 'text/javascript';
    s.src = 'http://platform.foursquare.com/js/widgets.js';
    s.async = true;
    var ph = document.getElementsByTagName('script')[0];
    ph.parentNode.insertBefore(s, ph);
})();
</script>
于 2013-06-11T01:54:26.040 回答