Facebook on Modal
Facebook on Modal
我有一个Facebook 'Like'按钮以及一个'Facepile'轮询器在多步引导模态窗口,但他们只出现,如果你通过页面,并返回到他们要显示的页面。在第一次浏览页面时,它们没有被加载。
<script>
function displayPage(pageId) {
$('div[id^="display"]').hide();
$('#display'+pageId).show();
$('.step').removeClass("active");
$('#step'+pageId).addClass("active");
if(pageId == 1) {
(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 id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<hgroup class="block fixed">
<h3>Header</h3>
<h4>Subheader</h4>
</hgroup>
</div>
<div class="modal-body" id="content">
<div id="display1" style="display:none;">
<h1>LIKE OUR PAGE</h1>
<div id="fb-root"></div>
<div class="fb-like" data-href="https://www.facebook.com/myaddress" data-width="125" data-height="35" data-layout="button_count" data-action="like" data-show-faces="false" data-share="false"></div>
<br><br>
<div class="fb-facepile" data-href="https://www.facebook.com/myaddress" data-width="395" data-max-rows="1" data-colorscheme="light" data-size="large" data-show-count="true"></div>
</div>
</div>
</div>
最初我只是将facebook函数置于调用modal的同一函数中。当我这样修改它时,它工作了。
$(document).ready(function() {
$("#myModal").on("show", function() {
(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'));
});
});
function displayPage(pageId) {
currentPageId = pageId;
$('div[id^="display"]').hide();
$('#display'+pageId).show();
$('.step').removeClass("active");
$('#step'+pageId).addClass("active");
if(pageId == 1 || pageId == 2) {
FB.XFBML.parse();
相关文章:
- 使用 jQuery 的 .on 函数如何获取事件的原始元素
- 如何在Bootstrap Modal中为动态点击生成的变量设置jade属性
- I'我设计了一个下拉菜单,onclick会出现,而on blur会消失
- window.on.scroll事件未启动
- ngSubmit在modal中不工作
- Socket.io on Mozilla Rhino
- CSS中的游标属性似乎不适用于USB On The Go
- jQuery点击ON现在使用.load触发关闭
- Jquery Modal表单登录与AJAX-ASP经典上的IE 9
- JQuery.on(“keydown”)追加到页面时不工作
- 使用.on动态添加jquery/js不知道的html元素
- angularjs$valid-on-dates在firefox中报告错误
- addEventListener on NodeList
- Use an external .jpg image in a gallery modal based on CSS &
- Angular JS ui-grid on Bootstrap modal
- Bootsrap Modal on hide 方法不会触发
- Jquery附加断点Remove on Modal
- Modal Notification Appear On Form Send, Foundation/Abide.js
- 使用localStorage()保存一个"closed"State on modal这样它就不会再显
- Facebook on Modal