加载特定脚本后如何显示内容？

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 显示 none，然后在加载脚本后使用您已经设置的匿名回调显示它。

HTML:

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

CSS:

.hide {
    display: none;
}

JS:

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

加载特定脚本后如何显示内容？

How to show something, once specific script is loaded?

javascript

jquery

performance

social-media