Question

我正在尝试使用outerHeight函数计算高度后将1 div的内容替换为另一个div。

基本上，如果用户没有登录到Facebook，我试图用样本图像替换mt facebook like box插件。（我正在使用超过21的身份验证，这就是为什么用户如果没有登录到Facebook并超过21岁就无法看到盒装插件的原因）

我在这里发布了一个类似的问题

facebook like box: Showing sample image instead of feed when user is not logged in on facebook

无论如何，这是我的完整代码。

HTML

<div id="fb-root"></div>
<script type="text/javascript">
    (function (d, s, id) {

        var userLang = 'nl';
        var locale = '';
        if (userLang == 'nl') {
            locale = 'nl_NL';
        }
        else if (userLang == 'en') {
            locale = 'en_US';
        }
        else {
            locale = 'fr_FR';
        }

        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/" + locale + "/all.js#xfbml=1&appId=*********";
        fjs.parentNode.insertBefore(js, fjs);
    } (document, 'script', 'facebook-jssdk'));
</script>


<div id="fsnMiddle" class="fbnl">
    <fb:like-box id="fbIframeBox" href="https://www.facebook.com/********" width="292" height="390" show_faces="true" colorscheme="dark" stream="false" show-border="false" header="false">
    </fb:like-box>
</div>

CSS

#fsnMiddle
{
    border: 1px solid #494949;
    border-radius: 6px;
    background-color: #202020;
    float: left;
    width: 290px;
    height: 400px;
    margin: 0 14px 0 0;
}

#fsnMiddle #fbIframeBox
{

}

#fsnMiddle #fbReplacement
{
    background-repeat: no-repeat;
    display: block;
    width: 290px;
    height: 400px;
}
#fsnMiddle.fbfr #fbReplacement
{
    background-image: url('../../../cms/images/***.jpg');
    width: 290px;
    height: 400px;
}
#fsnMiddle.fbnl #fbReplacement
{
    background-image: url('../../../cms/images/***.jpg');
    width: 290px;
    height: 400px;
}
#fsnMiddle.fben #fbReplacement
{
    background-image: url('../../../cms/images/***.jpg');
    width: 290px;
    height: 400px;
}

JS

setTimeout(function () {
    var height = $("#fbIframeBox span").outerHeight(true);
    if (height == 0) {
        $('#fbIframeBox').remove();

        var fbReplacement = "<a href='https://www.facebook.com/***' id='fbReplacement' target='_blank'></a>" ;

        $('#fsnMiddle').append(fbReplacement);
    }
}, 2000);

由于用户未登录Facebook。所以facebook likebox（id = fbIframeBox）的outerHeight应该在我的网站上为0，div fbIframeBox应该被fbReplacement替换。

但是代码无效，我无法替换基于outerHewight的div。

它也让我警告jQuery使用效率低下。

对此有任何帮助将受到高度赞赏。

jQuery outerheight：尝试删除和添加新div id时的低效使用

0 个答案: