社交媒体 Subscribe/Follow/Like 链接对动态添加的内容不起作用

Question

关于将带有 HTML 的动态内容添加到 subscribe/follow/like youtube 频道、twitter 帐户、facebook 页面，

订阅代码仅适用于初始静态加载内容，不适用于动态加载内容（在代码笔中我使用超时模拟了动态内容）。

静态内容存在于页面加载本身，它工作正常，即订阅社交媒体页面的代码是第一次执行，而不是动态内容。

CodePen : http://codepen.io/shmdhussain/pen/YWBBZw

谁能帮我解决这个问题或者如果你遇到同样的情况，建议

jQuery(function($){
  
  setTimeout(function(){
    var htmlcontent1 = '<div class="g-ytsubscribe" data-channel="GoogleDevelopers" data-layout="default" data-count="default"></div>';
    var htmlcontent2 = '<a class="twitter-follow-button"   href="https://twitter.com/TwitterDev" data-show-screen-name="false" data-lang="ar"> Follow @TwitterDev</a>';
    
      var htmlcontent3 = '<div class="fb-like" data-href="https://www.facebook.com/NASA" data-width="104" data-layout="button_count" data-action="like" data-size="small" data-show-faces="true" data-share="false"></div>';
    $(".dynadiv1").html(htmlcontent1);
    $(".dynadiv2").html(htmlcontent2);
    $(".dynadiv3").html(htmlcontent3);
  }, 9000);
})

<script src="https://apis.google.com/js/platform.js"></script>
<script>window.twttr = (function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0],
    t = window.twttr || {};
  if (d.getElementById(id)) return t;
  js = d.createElement(s);
  js.id = id;
  js.src = "https://platform.twitter.com/widgets.js";
  fjs.parentNode.insertBefore(js, fjs);
 
  t._e = [];
  t.ready = function(f) {
    t._e.push(f);
  };
 
  return t;
}(document, "script", "twitter-wjs"));</script>



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


<h1>static Content</h1>
<div class="staticdiv1 youtube">
<div class="g-ytsubscribe" data-channel="GoogleDevelopers" data-layout="default" data-count="default"></div>

</div>
<br />
<br />
<div class="staticdiv2 twitter">
  <a class="twitter-follow-button"   href="https://twitter.com/TwitterDev" data-show-screen-name="false" data-lang="ar"> Follow @TwitterDev</a>
</div>
<div class="staticdiv3 fb">
  <div class="fb-like" data-href="https://www.facebook.com/NASA" data-width="104" data-layout="button_count" data-action="like" data-size="small" data-show-faces="true" data-share="false"></div>
</div>
<h1>Dynamic Content</h1>
<div class="dynadiv1 youtube">

</div>
<br />
<br />
<div class="dynadiv2 twitter">

</div>
<br />
<br />
<div class="dynadiv3 fb">

</div>

我的解决方案。

Answer 1

您需要使用 FB.XFBML.parse 告诉 Facebook 有新内容。 https://developers.facebook.com/docs/reference/javascript/FB.XFBML.parse/

社交媒体 Subscribe/Follow/Like 链接对动态添加的内容不起作用

Social Media Subscribe/Follow/Like Links Not Working For dynamically added content

javascript

html

facebook

twitter

facebook-social-plugins