0

我遇到了一个问题，我试图显示一个弹出窗口，该弹出窗口使用 jQuery 的.load()函数来使用来自单独页面的内容填充 div。在这个单独的页面中，有 facebook 和 twitter 小部件。

每个小部件都需要自己的 js 代码。FB 建议将他们的 js 代码放在开始<body>标签之后，而 twitter 代码似乎很乐意放在结束</body>标签之前。直接查看时，这个单独的页面可以正常工作。

我正在使用以下函数将单独的页面加载到隐藏的 div 中；

JS

function load_overlay(url)
{
    var wrapper = $('.popup_wrapper');
    var content = $('.popup_wrapper .popup_content');
    content.html(''); // clear out the content first
    content.load(url, function() {

        $('.popup_bg').fadeIn(400, function() {
            wrapper.fadeIn();
            wrapper.animate({
                "top" : $(window).scrollTop() + 360
            });
        });

    });
}
load_overlay('/social-popup #main');

这里的问题是（从我读到的）是.load()当使用#选择器时会删除所有 js 并且不执行它，所以当通过调用时没有任何社交小部件加载.load()

我已经尝试在 html 页面中包含用于 fb 和 twitter 的 js，这是因为希望能够修复它而被调用，但是没有任何改变。

如何让这些小部件的 JS 为我的 ajax 加载内容加载？

4

1 回答 1

0

在使用每个社交小部件的 JS 实现时，我无法找到一个好的解决方案。

为了解决这个问题，我使用<iframe>了社交小部件的实现。这完全消除了<script>标签被删除的问题。

唯一需要注意的是，twitter 的 iframe 实现不支持自定义按钮的宽度和或高度，但这是一个公平的折衷方案。

于 2013-07-05T15:24:14.640 回答