HTML — кнопки не работают плагин facebook с Ajax
Оказывается, динамическая загрузка моего веб-контента с помощью 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>
Решение
Сразу после добавления динамических элементов в DOM, вы должны использовать FB.XFBML.parse проанализировать социальные плагины: https://developers.facebook.com/docs/reference/javascript/FB.XFBML.parse
Например:
contenedor.innerHTML = ajax.responseText;
FB.XFBML.parse();
Другие решения
Других решений пока нет …