Использование `window.location.hash.include` выдает« Объект не поддерживает свойство или метод «включает» »в IE11

173

Я проверяю URL, чтобы увидеть, содержит ли он или нет ?в нем для управления состоянием всплывающего хэша в окне. Все остальные браузеры не имеют проблем, только IE.

Отладчик выдает мне эту ошибку, когда я пытаюсь загрузить таким образом:

Объект не поддерживает свойство или метод « includes»

Я не получаю ошибку при загрузке страницы через popstate.

    $(document).ready(function(e) {
        if(window.location.hash) {
            var hash;
            if(window.location.hash.includes("?")) {
                alert('I have a ?');
                hash = window.location.hash.substring(window.location.hash.indexOf('#') + 0,window.location.hash.indexOf('?'));
            }else {
                hash = window.location.hash;
            };
            if (hash=="#DRS" || hash=="#DRP" || hash=="#DFFI" || hash=="#DCI" || hash=="#DCP" || hash=="#DRP" || hash=="#DRMA" || hash=="#EICS" || hash=="#ORG"){
                $(hash+'Content').addClass('pageOn').removeClass('pageOff');
            }else {
                $('#homeContent').addClass('pageOn').removeClass('pageOff');
            };
        } else {
            $('#homeContent').addClass('pageOn').removeClass('pageOff');
        }
        $(window).on('popstate', function() {
            var hash;
            if(window.location.hash.includes("?")) {
                hash = window.location.hash.substring(window.location.hash.indexOf('#') + 0,window.location.hash.indexOf('?'));
            }else {
                hash = window.location.hash;
            };
            if (hash=="#DRS" || hash=="#DRP" || hash=="#DFFI" || hash=="#DCI" || hash=="#DCP" || hash=="#DRP" || hash=="#DRMA" || hash=="#EICS" || hash=="#ORG"){
                $(this).navigate({target: $(hash+'Content')});
                if(window.location.hash.includes("?")) {
                }else{
                    location.href = location.href+'?';
                }
            }else {
                $(this).navigate({target: $('#homeContent')});
            };
        });
});
Эрик Гросскурт
источник
Какова ценность window.location.hashв Internet Explorer 11?
ноль

Ответы:

242

Согласно справочной странице MDN , includesне поддерживается в Internet Explorer. Простейшая альтернатива - использовать indexOfвот так:

if(window.location.hash.indexOf("?") >= 0) {
    ...
}
GOTO 0
источник
1
Хорошо, теперь я не могу заставить это работать if (window.location.hash.indexOf ("?")> = 0) {// ничего не делать} else {location.href = location.href + '?'; }
Эрик Гроскурт
Мне нужно добавить? до конца URL, если он еще не
найден
1
Я знаю, что это старый вопрос и ответ, но мне кажется, что String.prototype.include работает для меня в Windows 10 IE 11.
troxwalt
2
@troxwalt Приятно слышать, но он все еще не работает на Windows 7 IE11!
nevada_scout
Если вы React ING, вы можете использовать polyfill пакеты и избежать ручного добавления polyfills ...
CPHPython
58

IE11 реализует String.prototype.includes, так почему бы не использовать официальный Polyfill?

  if (!String.prototype.includes) {
    String.prototype.includes = function(search, start) {
      if (typeof start !== 'number') {
        start = 0;
      }

      if (start + search.length > this.length) {
        return false;
      } else {
        return this.indexOf(search, start) !== -1;
      }
    };
  }

Источник: полифилл источник

thiagoh
источник
1
Вы также можете использовать полифилл из core-js, найденный здесь: github.com/zloirock/core-js#stage-4-proposals
Дэвид Баррето
@DavidBarreto действительно! А для React здесь был добавлен более свежий ответ .
CPHPython
36

Добавление import 'core-js/es7/array';к моему polyfill.tsисправило проблему для меня.

JCisar
источник
Это было опубликовано давно, но, возможно, это может как-то помочь кому-то из более новых фреймворков, однако я думаю, что выбранного ответа должно быть достаточно для всего, кроме особых случаев использования.
Эрик Гроскурт
1
импорт 'core-js / es / array'; по состоянию на 2020 год
timhc22
14

У меня была похожая проблема с Angular-проектом. В моем polyfills.ts я должен был добавить оба:

    import "core-js/es7/array";
    import "core-js/es7/object";

В дополнение к включению всех остальных IE 11 по умолчанию. (См. Комментарии в polyfills.ts, если используется угловая)

После добавления этого импорта ошибка исчезла, и данные моего объекта заполнились, как и предполагалось.

bsheps
источник
Это работает для меня. Что эти два импорта делают в любом случае? И какой импорт исправил ошибку включения? Или оба из них для ошибки включения?
Ямошуа
Поскольку IE11 больше не получает обновления функций от Microsoft, реализация javascript устарела и имеет поддержку только для методов через ES5. Импортируя эти 2 файла, вы добавляете сценарии полизаполнения для массива и объекта через ES7, которые включают в себя метод «включает».
bsheps
5

Как и в Internet Explorer, метод javascript «include» не поддерживает, что приводит к ошибке, как показано ниже

dijit.form.FilteringSelect TypeError: Объект не поддерживает свойство или метод «include»

Поэтому я изменил строковый метод JavaScript с «include» на «indexOf», как показано ниже

//str1 doesn't match str2 w.r.t index, so it will try to add object
var str1="acd", str2="b";
if(str1.indexOf(str2) == -1) 
{
  alert("add object");
}
else 
{
 alert("object not added");
}
сатистский наемник
источник
3

Я использовал includesот Lodashкоторого действительно похожа на родную.

Моасир Роза
источник
1

Я использую ReactJs и использовал import 'core-js/es6/string';в начале, index.jsчтобы решить мою проблему.

Я также использую import 'react-app-polyfill/ie11';для поддержки запуска React в IE11.

реагируют-приложение-polyfill

Этот пакет включает в себя полифилы для различных браузеров. Он включает минимальные требования и часто используемые языковые функции, используемые проектами Create React App.

https://github.com/facebook/create-react-app/blob/master/packages/react-app-polyfill/README.md

Бхушан Бабар
источник
1
Я начал вручную заполнять все функции, которые не работают в консоли IE11 ... Очень ценю ваш экономящий время ответ. Чтобы добавить эти 2 пакета сразу в ваш package.json :npm i --save core-js react-app-polyfill
CPHPython
Кстати, core-js/es6кажется, больше не существует в v3, так же, import 'core-js';как предложено в Github .
CPHPython
0

Этот вопрос и его ответы привели меня к моему собственному решению (с помощью SO), хотя некоторые говорят, что вы не должны вмешиваться в нативные прототипы:

  // IE does not support .includes() so I'm making my own:
  String.prototype.doesInclude=function(needle){
    return this.substring(needle) != -1;
  }

Тогда я просто заменил все .includes()на .doesInclude()и моя проблема была решена.

TecBrat
источник
2
.includes ()работает как со строками, так и с массивами. Ваше substring()решение работает только со строками и не работает с массивами. Как ответили другие люди, лучше использовать indexOf()вместо, substring()потому что это работает в обоих случаях.
Мемет Олсен