單擊顯示評論后加載Facebook評論

Question

我在應用程序中使用Facebook評論插件。 當頁面被訪問時，它會減慢頁面加載速度。

如何添加一個名為“ 顯示評論”的按鈕，並且僅在單擊按鈕后才可以render Facebook評論插件。

這是一個例子

這就是我到目前為止

<div class="fb-comments" data-href="https://developers.facebook.com/docs/plugins/comments#configurator" data-numposts="5"></div>

<div id="fb-root"></div>
<script>

    (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#xfbml=1&version=v2.7&appId=<APP_ID>";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));


</script>

Answer 1

您可以使用自定義功能

<button onClick="showComments();">show comments</button>


<div class="fb-comments" data-href="https://developers.facebook.com/docs/plugins/comments#configurator" data-numposts="5"></div>

<div id="fb-root"></div>
<script>
  function showComments() { // Custom function called on click
    (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#xfbml=1&version=v2.7&appId=<APP_ID>";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
  }

</script>