我已经拖网和堆栈溢出,但找不到这个问题的适当答案。在开始尝试寻找自己的解决方案的尝试和错误过程之前,我认为我应该转向Stack Overflow机构,以查看是否已经成功实现。
我有一个AJAX驱动的页面,对于非JavaScript浏览器和SEO,该页面可以正常降级。AJAX版本中的每次点击都可以由唯一的URL表示。
我想做的是动态更改按钮的HREF。我确实知道该标记会在运行时转换为标准HTML(即转换为讨厌的表格/ iframe布局)。
我只是想知道是否有人对如何在AJAX驱动的页面上实现类似FB的按钮有任何见解?
提前加油:)
编辑:
您如何看待我刚刚一起尝试过的这种方法?看到有什么大问题吗?
<!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>
简单的解决方案
加载完成后,只需进行解析即可触发解析函数。
如果您使用的是jQuery,则有一个解决此问题的简便易行的解决方案:
$(document).ajaxComplete(function(){ try{ FB.XFBML.parse(); }catch(ex){} });
http://developers.facebook.com/docs/reference/plugins/like/