javascript - 当我的标记加载到传单 map 中时，如何添加加载图标/加载器？

Question

我正在从 API 获取数据，数据采用 Json 格式，“数据点”是 Json 对象。加载大约 300 个标记需要相当长的时间，因此我想在加载这些标记时添加一个加载器，并且加载器应该在所有标记加载完毕后立即关闭。怎么办？

Answer 1

最常见的方法是有一些像这样的html:

<div id="loader"></div>

然后使用 CSS 对其进行样式设置:

#loader {
    background: url(spinner.gif);
    width:20px;
    height:20px;
    position:absolute;
    display:none;
}

然后在您的 javascript 函数中进行 api 调用，执行以下操作:

$("#loader").show();
$.ajax( "http://apisite.com/apicall" ).done(function() {
    $("#loader").hide();
});

您的 javascript 调用可能看起来会有所不同，但核心方面是在执行 ajax 调用之前显示微调器 div，并在 ajax 调用完成后隐藏它。