前端开发实例：利用Javascript闭包创建加载提示框

构造器

function loadingBoxMaker() {
  let loadingBoxId = "";
  return {
    show: function (id) {
      this.loadingBoxId = id+new Date().valueOf();
      var dlgWaiting = '<div id="'+ this.loadingBoxId +'" style="text-align: center;z-index: 9999;"><span class="text-center">Loading...</span><i class="fa fa-spinner fa-spin fa-3x fa-fw"></i></div>';
      $("#"+id).append($(dlgWaiting));
    },
    hide: function() {
      $(this.loadingBoxId).remove();
    }
  }
}

页面使用

在页面使用时，挂载在对应的<div>上。

<div id="prjectTypeChart" style="height: 253px;"></div>

<div>的id作为参数传入，注意不带"#"

loadingBoxMaker().show("prjectTypeChart")

效果