substr () с отрицательным значением не работает в IE

Question

РЕДАКТИРОВАТЬ: я изменил заголовок, потому что проблема не имела никакого отношения к IE IE.fl () - у меня не работала substr () (см. Принятый ответ).

---

Существует масса сообщений о том, что вы должны определить свой обработчик загрузки перед назначением img.src, чтобы гарантировать, что обработчик загрузки включен, если изображение сначала загружается из кэша.

Это не похоже на проблему в моем коде, поскольку именно это я и сделал.

Обратите внимание, что этот скрипт работает во всех других браузерах, но IE 8 и ниже не запускает встроенную функцию загрузки.

var i = lastSlideIndex || 1;

while(imagesQueued < MAX_IMAGES){
    var preloadImage = new Image();
    preloadImage.arrayIndex = i;
    preloadImage.onload = function(eventObj){
        debug('Image ' + this.src + ' loaded.');
        slideshowImages[this.arrayIndex] = this;
        if (this.arrayIndex > lastImageIndex) lastImageIndex = this.arrayIndex;
        triggerSlideshow(this.arrayIndex);
    }

    // add leading zeros
    var leadingZeros = "0000000".substr(-(String(MAX_IMAGES).length));
    imageNumber = leadingZeros.substr(String(i).length) + i;

    debug('preloading Image #' + imageNumber);
    preloadImage.src = fullImagePrefix + imageNumber + "." + IMAGES_TLA;

    if (++i > MAX_IMAGES) i = 1;
    imagesQueued++;
}

Любые другие предложения будут высоко оценены!

Answer 1

Теперь, когда в IE 8 этот вопрос озаглавлен примерно на substr(), вот быстрое решение проблемы отрицательного индекса. Вставьте следующий код из Mozilla Developer Network :

// only run when the substr() function is broken
if ('ab'.substr(-1) != 'b') {
  /**
   *  Get the substring of a string
   *  @param  {integer}  start   where to start the substring
   *  @param  {integer}  length  how many characters to return
   *  @return {string}
   */
  String.prototype.substr = function(substr) {
    return function(start, length) {
      // call the original method
      return substr.call(this,
        // did we get a negative start, calculate how much it is from the beginning of the string
        // adjust the start parameter for negative value
        start < 0 ? this.length + start : start,
        length);
    }
  }(String.prototype.substr);
};

Этот код обнаруживает нарушенную реализацию substr и заменяет ее на совместимую.

Answer 2

Обновление: Как отметили комментаторы (и пока я не могу доказать их иначе), я удалил первое предложение.

Еще пара замечаний:

onload Событие не сработает, если изображение загружается из кеша. Попробуйте очистить кэш и повторите попытку.

Другая проблема состоит в том, что IE не любит отрицательный в substr. Используйте slice вместо:

"0000000".slice(-(String(MAX_IMAGES).length));

Answer 3

Два способа решения этой проблемы:

1. Добавьте параметр nonce к URL-адресам вашего изображения.

   var nonce = new Date().getTime();
   
   // ...
   
   preloadImage.src = fullImagePrefix + imageNumber + "." + IMAGES_TLA + ('?_=' + nonce++);
   

2. Установите "src""свойство в другом цикле событий.

   setTimeout(function(img, src) {
     img.src = src;
   }(preloadImage, fullImagePrefix + imageNumber + "." + IMAGES_TLA), 1);
   

Используя параметр nonce каждый раз, когда вы выбираете изображение, вы обходите кеш.Возможно, это не очень хорошая идея, поэтому второй вариант позволяет обойти проблему, убедившись, что свойство "src" установлено в отдельном цикле обработки событий.Тогда сработает «нагрузка».

Здесь является примером.Код использует одноразовые значения на некоторых изображениях, но устанавливает для них «src» в обработчике тайм-аута.Как вы можете видеть, они все загружаются (становятся красными).

Я не знаю, почему IE не запускает обработчик «загрузки», когда изображение находится в кеше, но делает, когда «src»устанавливается в другом цикле событий, из которого инициализируется (иначе) объект изображения.

edit - Здесь - это та же скрипка, но измененная для пропуска времени ожидания,В IE8 вы должны заметить, что четные изображения часто не обращаются к обработчикам «загрузки».