IE11下Divi网站弹窗非首页无法加载，提示'Promise' is undefined问题求助

你已经搞定了padStart()的兼容问题，但现在遇到的Promise is undefined报错，本质是IE浏览器原生不支持ES6的Promise对象——首页大概率是加载了其他带Promise兼容代码的脚本（比如分析工具、主题内置组件），所以能正常运行；但其他页面没有这份依赖，就触发了报错。

下面给你两个直接可行的解决思路：

1. 添加Promise的Polyfill兼容代码 #

把这段Promise兼容代码放在你之前的padStart() polyfill之前，确保它在弹窗插件的脚本加载前执行：

if (typeof Promise === 'undefined') {
  window.Promise = function Promise(executor) {
    if (typeof executor !== 'function') {
      throw new TypeError('Promise executor must be a function');
    }
    var self = this;
    self._state = 0;
    self._handled = false;
    self._value = undefined;
    self._deferreds = [];

    function resolve(value) {
      try {
        if (value === self) throw new TypeError('A promise cannot be resolved with itself.');
        if (value && (typeof value === 'object' || typeof value === 'function')) {
          var then = value.then;
          if (typeof then === 'function') {
            doResolve(then.bind(value), resolve, reject);
            return;
          }
        }
        self._state = 1;
        self._value = value;
        finale();
      } catch (e) {
        reject(e);
      }
    }

    function reject(reason) {
      self._state = 2;
      self._value = reason;
      finale();
    }

    function finale() {
      for (var i = 0, len = self._deferreds.length; i < len; i++) {
        handle(self._deferreds[i]);
      }
      self._deferreds = null;
    }

    function handle(deferred) {
      while (self._state === 3) {
        self = self._value;
      }
      if (self._state === 0) {
        self._deferreds.push(deferred);
        return;
      }
      self._handled = true;
      setTimeout(function() {
        var cb = self._state === 1 ? deferred.onFulfilled : deferred.onRejected;
        if (cb === null) {
          (self._state === 1 ? resolve : reject)(deferred.promise._value);
          return;
        }
        var ret;
        try {
          ret = cb(self._value);
        } catch (e) {
          reject(deferred.promise, e);
          return;
        }
        resolve(deferred.promise, ret);
      }, 0);
    }

    function doResolve(fn, onFulfilled, onRejected) {
      var done = false;
      try {
        fn(function(value) {
          if (done) return;
          done = true;
          onFulfilled(value);
        }, function(reason) {
          if (done) return;
          done = true;
          onRejected(reason);
        });
      } catch (ex) {
        if (done) return;
        done = true;
        onRejected(ex);
      }
    }

    doResolve(executor, resolve, reject);
  };

  Promise.prototype.then = function(onFulfilled, onRejected) {
    var prom = new this.constructor(function() {});
    handle({
      promise: prom,
      onFulfilled: typeof onFulfilled === 'function' ? onFulfilled : null,
      onRejected: typeof onRejected === 'function' ? onRejected : null
    });
    return prom;
  };

  Promise.prototype.catch = function(onRejected) {
    return this.then(null, onRejected);
  };

  Promise.resolve = function(value) {
    if (value && typeof value === 'object' && value.constructor === Promise) {
      return value;
    }
    return new Promise(function(resolve) {
      resolve(value);
    });
  };

  Promise.reject = function(reason) {
    return new Promise(function(resolve, reject) {
      reject(reason);
    });
  };

  Promise.all = function(arr) {
    return new Promise(function(resolve, reject) {
      if (!arr || typeof arr.length === 'undefined') {
        throw new TypeError('Promise.all accepts an array');
      }
      var args = Array.prototype.slice.call(arr);
      if (args.length === 0) return resolve([]);
      var remaining = args.length;

      function res(i, val) {
        try {
          if (val && (typeof val === 'object' || typeof val === 'function')) {
            var then = val.then;
            if (typeof then === 'function') {
              then.call(val, function(val) {
                res(i, val);
              }, reject);
              return;
            }
          }
          args[i] = val;
          if (--remaining === 0) {
            resolve(args);
          }
        } catch (ex) {
          reject(ex);
        }
      }

      for (var i = 0; i < args.length; i++) {
        res(i, args[i]);
      }
    });
  };

  Promise.race = function(arr) {
    return new Promise(function(resolve, reject) {
      if (!arr || typeof arr.length === 'undefined') {
        throw new TypeError('Promise.race accepts an array');
      }
      for (var i = 0; i < arr.length; i++) {
        Promise.resolve(arr[i]).then(resolve, reject);
      }
    });
  };
}

接着把你之前的padStart()兼容代码放在这段代码后面，确保两个兼容逻辑都能生效。

2. 让兼容代码全局加载（推荐） #

为了避免页面间的差异，最好把这两段兼容代码添加到Divi主题的全局脚本中：

• 可以通过主题后台的Divi > Theme Options > Integration，在"Add code to the < head > of your blog"里插入完整的脚本代码；
• 或者直接添加到子主题的functions.php文件中，用wp_enqueue_script的方式加载（更方便管理）：

function add_ie_polyfills() {
  wp_add_inline_script( 'jquery', '
    // Promise兼容代码
    if (typeof Promise === "undefined") {
      // ...上面的Promise完整代码...
    }
    // padStart兼容代码
    if (!String.prototype.padStart) {
      String.prototype.padStart = function padStart(targetLength, padString) {
        targetLength = targetLength >> 0;
        padString = String((typeof padString !== "undefined" ? padString : " "));
        if (this.length > targetLength) {
          return String(this);
        } else {
          targetLength = targetLength - this.length;
          if (targetLength > padString.length) {
            padString += padString.repeat(targetLength / padString.length);
          }
          return padString.slice(0, targetLength) + String(this);
        }
      };
    }
  ', 'before' );
}
add_action( 'wp_enqueue_scripts', 'add_ie_polyfills' );

这样所有页面都会在核心脚本加载后、弹窗插件脚本前加载这两个兼容代码，就能彻底解决IE下的Promise未定义问题了。

内容的提问来源于stack exchange，提问作者Rajesh Kumar