使用`window.location.hash.includes`会在IE11中引发“对象不支持属性或方法'includes'”


174

我正在检查URL,以查看它是否包含或包含一个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.hashInternet Explorer 11中的值是什么?
nils 2015年

Answers:


242

根据MDN参考页includesInternet Explorer不支持。最简单的替代方法是使用indexOf,例如:

if(window.location.hash.indexOf("?") >= 0) {
    ...
}

1
好吧,现在我无法使它正常工作if(window.location.hash.indexOf(“?”)> = 0){//不做任何其他操作else {location.href = location.href +'?'; }
Erik Grosskurth

我需要添加一个?如果该URL还没有一个,则返回到该URL的末尾
Erik Grosskurth 2015年

1
我知道这是一个古老的问题和答案,但是String.prototype.includes似乎在Windows 10 IE 11上对我
有用。– troxwalt

2
@troxwalt很好听,但在Windows 7 IE11上仍然不起作用!
nevada_scout

如果您正在React中,则可以使用polyfill包,避免手动添加
polyfill

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;
      }
    };
  }

来源:polyfill来源


1
您还可以使用以下位置的core-js的polyfill
David Barreto

@DavidBarreto确实!对于React,这里添加了更新的答案
CPHPython

37

添加import 'core-js/es7/array';到我的polyfill.ts解决了该问题对我来说。


这是很久以前发布的,但是也许可以以某种方式对新框架的某人有所帮助,但是我认为所选答案应该足以满足特殊用例之外的任何需求。
Erik Grosskurth

1
导入'core-js / es / array'; 截至2020年
timhc22

15

我在Angular项目中遇到了类似的问题。在我的polyfills.ts中,我必须同时添加两个:

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

除了启用所有其他IE 11默认值。(如果使用角,请参见polyfills.ts中的注释)

添加这些导入后,错误消失了,并且按预期填充了我的对象数据。


这为我工作。那两个进口到底做什么?什么导入修复了包含错误?还是两个em都包含错误?
iamjoshua,

由于IE11不再接收Microsoft的功能更新,因此javascript实现已过时,仅支持通过ES5的方法。通过导入这两个文件,您将通过ES7添加包含“ includes”方法的Array和Object的polyfill脚本。
bsheps

5

与Internet Explorer一样,javascript方法“ includes”不支持,这导致出现以下错误

dijit.form.FilteringSelect TypeError:对象不支持属性或方法“ includes”

因此,我将JavaScript字符串方法从“ includes”更改为“ 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");
}


1

我正在使用ReactJs,并import 'core-js/es6/string';在开始时index.js用来解决我的问题。

我也import 'react-app-polyfill/ie11';用来支持在IE11中运行React。

react-app-polyfill

该软件包包括适用于各种浏览器的polyfill。它包括Create React App项目使用的最低要求和常用语言功能。

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


1
我开始手动填充IE11控制台中所有失败的功能...非常感谢您节省时间的答案。要将这两个软件包立即添加到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()问题就解决了。


2
.includes ()适用于字符串和数组。您的substring()解决方案仅适用于字符串,而不适用于数组。就像其他人回答的那样,使用indexOf()代替substring()会更好,因为这在两种情况下都有效。
Memet Olsen
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.