每当用户使用 JQuery 执行特定操作时,我都需要在页面上加载多个 Facebook 评论框。 (http://developers.facebook.com/docs/reference/plugins/comments/)
如果我要一次加载所有评论字段,我就可以让它工作,但这是不好的编程习惯。
当我尝试按顺序加载评论时,出现第一个评论,但所有后续评论都无法加载。
我创建了一个测试脚本来演示。
Page 1:
<script src='http://code.jquery.com/jquery-1.6.4.min.js'></script>
<div id='A' align='center' onclick='clickA();'><strong>AAAAAAAAAAAAAAAAAAAAA</strong></div>
<div id='B' align='center' onclick='clickB();'><strong>BBBBBBBBBBBBBBBBBBBBB</strong></div>
<div id='C' align='center' onclick='clickC();'><strong>CCCCCCCCCCCCCCCCCCCCC</strong></div>
<div id='ALL' align='center' onclick='load_all();'><strong>Load ALL</strong></div>
<script>
var facebook_comments_page = 'http://localhost/test2.html';
function clickA(){
$('#A').load( facebook_comments_page);
}
function clickB(){
$('#B').load(facebook_comments_page);
}
function clickC(){
$('#A').empty();//not working to remove the dom
$('#A').detach();//not working to remove the dom
$('#A').remove();//not working to remove the dom
$('#C').load(facebook_comments_page );
}
function load_all(){
$('#A').load(facebook_comments_page);
$('#B').load(facebook_comments_page);
$('#C').load(facebook_comments_page);
}
</script>
第 2 页 - 实际的 Facebook 评论页面 (test2.html):
<script class='fb-comments'>(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_US/all.js#xfbml=1';
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class='fb-comments' data-href='http://example.com' data-num-posts='2' data-width='470' ></div>
在此示例中,如果您最初按 AAAA、BBBB 或 CCCC,则会加载 Facebook 评论页面。但如果您按其余任何一个,它们就不会加载。但是,如果您首先选择“加载全部”,则所有三个都会加载。
对于CCC,我认为如果破坏AAA的内容,那么CCC就会加载。然而,事实并非如此。我认为 JQuery 正在以某种方式杀死后续调用中的脚本内容。
任何帮助将不胜感激!