Question

我在页面上有一个json对象列表，每个对象都包含页面ID。我想在页面上的数据表的每一行都可以看到facebook send-to-messenger按钮。但是当我迭代时，只能看到一个按钮。它不起作用。如何在循环中做到这一点？

我有一个静态部分

<script>
    window.fbAsyncInit = function() {
        FB.init({
            appId: '<appid>',
            xfbml: true,
            version: 'v2.6'
        });
    };
    (function(d, s, id){
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) {return;}
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/en_US/sdk.js";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
</script>

和动态部分

$.each(data, function (key, value) {
//...
<div class="fb-send-to-messenger"+
    'messenger_app_id="<appid>"'+
    'page_id="'+value.id+'"'+
    'data-ref="WELCOME_OPTIN_TOKEN"'+
    'color="blue"'+
    'size="standard">
//...
}

value.id是页面标识

怎么做？或者是否有任何javascript函数可以实现它？

Answer 1

您正在使用JavaScript动态生成它们，因此您必须在将插件添加到DOM后立即用FB.XFBML.parse()解析插件。请确保在FB之后使用FB.init。

例如：

<script>
    window.fbAsyncInit = function() {
        FB.init({
            appId: '<appid>',
            xfbml: true,
            version: 'v2.6'
        });
        $.each(data, function (key, value) {
        //...
        <div class="fb-send-to-messenger"+
            'messenger_app_id="<appid>"'+
            'page_id="'+value.id+'"'+
            'data-ref="WELCOME_OPTIN_TOKEN"'+
            'color="blue"'+
            'size="standard">
        //...
        }
        FB.XFBML.parse();
    };
    (function(d, s, id){
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) {return;}
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/en_US/sdk.js";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
</script>

多个Facebook发送到信使按钮

1 个答案: