Cómo agregar un botón "Me gusta" de Facebook a una página impulsada por AJAX
He rastreado la red y Stack Overflow y no he encontrado una respuesta adecuada a esta pregunta. Antes de comenzar el proceso de prueba y error de encontrar mi propia solución, pensé en recurrir a la confianza de Stack Overflow y ver si ya había una implementación exitosa.
Tengo una página con tecnología AJAX que se degrada correctamente para navegadores que no son JavaScript y SEO. Cada clic en la versión AJAX se puede representar mediante una URL única.
Lo que quiero hacer es cambiar dinámicamente el HREF del botón. Entiendo que esta etiqueta se convierte a HTML estándar en tiempo de ejecución (es decir, en un diseño de tabla / iframe desagradable).
Me preguntaba si alguien tenía alguna idea sobre cómo implementar este botón de me gusta FB en páginas con tecnología AJAX.
Saludos de antemano :)
EDITAR:
¿Qué opinas de este método que acabo de piratear juntos? ¿Ves algún gran problema con eso?
<!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 runat="server">
<title></title>
<script src="JS/jquery/jquery.js" type="text/javascript"></script>
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<script language="javascript" type="text/javascript">
$("document").ready
(
function ()
{
CreateNewLikeButton("http://www.yahoo.com")
$("a#ChangeToGoogle").click
(
function (e)
{
e.preventDefault();
CreateNewLikeButton("http://www.google.ca")
}
);
}
);
function CreateNewLikeButton(url)
{
var elem = $(document.createElement("fb:like"));
elem.attr("href", url);
$("div#Container").empty().append(elem);
FB.XFBML.parse($("div#Container").get(0));
}
</script>
</head>
<body>
<form id="form1" runat="server">
<a id="ChangeToGoogle" href="#">Change To Google</a>
<div id="Container">
<fb:like href="http://www.NEVER_LINK_TO_THIS_12345.com"></fb:like>
</div>
</form>
</body>
</html>