Question

事实证明，动态加载我的网页内容与AJAX，如按钮和评论插件无法正常工作。我怎么能让它工作？

我正在通过Ajax php加载内容。使用按钮加载div内容还包括插件和评论Facebook代码

原谅我的英语水平不高

由于

HTML index.php：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>


    <script>


     function nuevoAjax(){
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp = false;
}
}
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
xmlhttp = new XMLHttpRequest();
}
return xmlhttp;
}


function cargarbio(pagina,destino){
var contenedor;
var ajax;

contenedor = document.getElementById(destino);
ajax = nuevoAjax();
ajax.open("GET", pagina, true);
ajax.onreadystatechange=function() {
if (ajax.readyState==4) {
contenedor.innerHTML = ajax.responseText;
}
}
ajax.send(null);
}

    </script>


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

<div id="center">
    <div id="buttons">
     <?php include($_SERVER['DOCUMENT_ROOT']."/buttons.php"); ?>
    </div>
        <div id="left"><?php include($_SERVER['DOCUMENT_ROOT']."/left2015.php"); ?>
    </div>

    <div id="content">     <?php include($_SERVER['DOCUMENT_ROOT']."/player.php"); ?>
    </div>

 <div id="content-text"> <?php include($_SERVER['DOCUMENT_ROOT']."/comment.php"); ?>


  </div>



  <div id="down">
  <?php include($_SERVER['DOCUMENT_ROOT']."/pie.php"); ?>
</div>
  </div>
</body>
</html>

buttons.php：

<div id="buttons-up">
<li><a href="#" onClick="cargarbio('<?php $_SERVER['DOCUMENT_ROOT']?>/comment.php','content-text')">INDEX</a></li>
     <li><a href="#" onClick="cargarbio('<?php $_SERVER['DOCUMENT_ROOT']?>/rome.php','content-text')">ROME</a></li>

  <li><a href="#" onClick="cargarbio('<?php $_SERVER['DOCUMENT_ROOT']?>/contact.php','content-text')">CONTACT</a></li>

</ul>



</div>

comment.php

<div id="para-comentarios-radio">
          <div class="fb-comments" data-href="http://www.example.com/bio/rome/rome.php" data-width="625" data-num-posts="36"></div>
</div>

rome.php

<div id="container5b">

  <div id="superior1">
  <div id="description">
 Beginning with the Renaissance, almost all the popes since Nicholas V (1422–55) pursued coherently along four hundred years an architectonic and urbanistic program aimed to make of the city the world's artistic and cultural center
</div>
<div class="coment-box"><div class="coment-facebook"><div class="container-likes"><div class="fbt2"><div class="fb-like" data-href="http://www.example.com/bio/rome/rome.php" data-send="true" data-layout="button_count" data-width="600" data-show-faces="false" data-font="lucida grande"></div></div></div></div>
           <div class="contenedor-comment"><a name="ancla-comentary"></a><div class="fb-comments" data-href="http://www.example.com/bio/rome/rome.php" data-width="595" data-num-posts="25"></div></div>
</div>
<div class="abajo"><ul class="menu-ir-arriba">
<li><a href="#top">Ir arriba</a></li>
</ul></div>

Answer 1

在将动态元素添加到DOM之后，您必须使用FB.XFBML.parse来解析社交插件：https://developers.facebook.com/docs/reference/javascript/FB.XFBML.parse

例如：

contenedor.innerHTML = ajax.responseText;
FB.XFBML.parse();

按钮不适用于Ajax的facebook插件

1 个答案: