laydate 在 ie 浏览器中无法弹出

Posted 2020-12-14 wanghui05

背景：目前项目使用 Angular 开发，里面引入了 laydate.js 做日期控件。

问题：最近项目从 Angular8 升级到了 Angular9，发现升级之后在 IE 里面不能打开日期弹框了。

原因：经过一系列的调试操作之后终于发现，Angular9 的 script 标签都使用了 defer，在 laydate.js 加载的时候他们并没有加载完毕，所以 laydate.js 中不能获取到当前正在加载的 script 的 src 值。这时候它会去获取最后一个 script 标签的 src 值，好死不死的是我们的主页里面最后一个 script 不是引入的，它没有 src 值，这时候 getPath 函数就返回 undefined 了，导致整个组件不加载。

解决：修改 getPath 方法，将获取 src 改成获取最后一个带 src 的 script 的src 值。

 

原来代码如下：

getPath: function(){
      var jsPath = document.currentScript ? document.currentScript.src : function(){
        var js = document.scripts
        ,last = js.length - 1
        ,src;
        for(var i = last; i > 0; i--){
          if(js[i].readyState === ‘interactive‘){
            src = js[i].src;
            break;
          }
        }
        return src || js[last].src;
      }();
      return jsPath.substring(0, jsPath.lastIndexOf(‘/‘) + 1);
}()

　　

 

修改后的代码：

getPath: (function () {
                var jsPath = document.currentScript
                    ? document.currentScript.src
                    : (function () {
                          var js = document.scripts,
                              last = js.length - 1,
                              src;

                          for (var i = last; i > 0; i--) {
                              if (js[i].readyState === ‘interactive‘) {
                                  src = js[i].src;
                                  break;
                              }
                          }
                          var srcJs = [].slice
                              .call(js)
                              .filter(function (scriptItem) {
                                  return scriptItem.src;
                              });
                          return src || srcJs[srcJs.length - 1].src;
                      })();
                return jsPath.substring(0, jsPath.lastIndexOf(‘/‘) + 1);
})(),