一旦加载了特定的脚本，如何显示某些内容？

Question

我有一个小工具，上面有社交媒体分享按钮。用于按钮的API需要很多秒的时间来加载，选项卡有一个旋转图标，这些按钮是可见的，但不能使用。这显然很糟糕。

我现在使用下面的小脚本在页面加载之后加载API，我想保留这个脚本。

<script>
// Load the share API's once the entire page is loaded.
    $(window).bind("load", function() {
       $.getScript('js/share.js', function() {});
    });
</script>

但我也想隐藏社交媒体按钮div，直到脚本中的API已经加载，我如何实现这一点？

Answer 1

使您的div不显示任何，然后使用您已经安装的匿名回调在加载脚本后显示它。

HTML：

<div id="socialmedia" class="hide"></div>

CSS：

.hide {
    display: none;
}

联署材料：

$(window).bind("load", function () {
    $.getScript('js/share.js',
        function () {
            $('#socialmedia').removeClass('hide');
        }
    );
});