web-dev-qa-db-de.com

Code läuft nicht ein IE 11 funktioniert gut in Chrome

Der folgende Code kann in Chrome ohne Probleme ausgeführt werden. In Internet Explorer 11 wird jedoch der folgende Fehler ausgegeben.

Das Objekt unterstützt weder die Eigenschaft noch die Methode 'startsWith'.

Ich speichere die ID des Elements in einer Variablen. Was ist das Problem?

function changeClass(elId) {
  var array = document.getElementsByTagName('td');
  
  for (var a = 0; a < array.length; a++) {
    var str = array[a].id;
    
    if (str.startsWith('REP')) {
      if (str == elId) {
        array[a].style.backgroundColor = "Blue";
        array[a].style.color = "white";
      } else {
        array[a].style.backgroundColor = "";
        array[a].style.color = "";
      }
    } else if (str.startsWith('D')) {
      if (str == elId) {
        array[a].style.backgroundColor = "Blue";
        array[a].style.color = "white";
      } else {
        array[a].style.backgroundColor = "";
        array[a].style.color = "";
      }
    }
  }
}
<table>
  <tr>
    <td id="REP1" onclick="changeClass('REP1');">REPS</td>
    <td id="td1">&nbsp;</td>
  </tr>
  <tr>
    <td id="td1">&nbsp;</td>
    <td id="D1" onclick="changeClass('D1');">Doors</td>
  </tr>
  <tr>
    <td id="td1">&nbsp;</td>
    <td id="D12" onclick="changeClass('D12');">Doors</td>
  </tr>
</table>

javascripthtml
127
Bhushan Dhamdhere

String.prototype.startsWith ist eine Standardmethode in der neuesten Version von JavaScript, ES6.

Wenn Sie die Kompatibilitätstabelle unten betrachten, können Sie feststellen, dass sie auf allen aktuellen Hauptplattformen unterstützt wird, mit Ausnahme von Versionen von Internet Explorer.

╔═══════════════╦════════╦═════════╦═══════╦═══════════════════╦═══════╦════════╗
║    Feature    ║ Chrome ║ Firefox ║ Edge  ║ Internet Explorer ║ Opera ║ Safari ║
╠═══════════════╬════════╬═════════╬═══════╬═══════════════════╬═══════╬════════╣
║ Basic Support ║    41+ ║     17+ ║ (Yes) ║ No Support        ║    28 ║      9 ║
╚═══════════════╩════════╩═════════╩═══════╩═══════════════════╩═══════╩════════╝

Sie müssen .startsWith selbst implementieren. Hier ist die Polyfill :

if (!String.prototype.startsWith) {
  String.prototype.startsWith = function(searchString, position) {
    position = position || 0;
    return this.indexOf(searchString, position) === position;
  };
}
266
Oka

text.indexOf("newString") ist die beste Methode anstelle von startsWith.

Beispiel:

var text = "Format";
if(text.indexOf("Format") == 0) {
    alert(text + " = Format");
} else {
    alert(text + " != Format");
}
22
Jona

Wenn dies in der Anwendung Angular 2+ geschieht, können Sie einfach uncomment string polyfills in polyfills.ts 

import 'core-js/es6/string';
9
Vitaliy Ulantikov

Das Hinzufügen des folgenden Codes zur JS-Datei funktionierte für mich:

if (!String.prototype.startsWith) {
  String.prototype.startsWith = function(searchString, position) {
     position = position || 0;
    return this.indexOf(searchString, position) === position;
  };
}
3
Misha Jain

Wie bereits erwähnt, sind startsWith und endsWith Teil von ES6 und nicht in IE11 verfügbar. In unserem Unternehmen wird die lodash-Bibliothek immer als Polyfill-Lösung für den IE11 verwendet. https://lodash.com/docs/4.17.4

_.startsWith([string=''], [target], [position=0])
2
mbokil

Ich habe vor kurzem auch das Problem gesehen. Ich löste mit ^ was ähnlich wie startwith in jquery ist. Sagen,

var str = array[a].id;
if (str.startsWith('REP')) {..........}

wir können benutzen

if($("[id^=str]").length){..........}

Hier ist str die ID des Elements.

0
User Learning

Während der Beitrag von Oka großartig funktioniert, könnte er etwas veraltet sein. Ich habe herausgefunden, dass lodash es mit einer einzigen Funktion lösen kann. Wenn Sie lodash installiert haben, sparen Sie möglicherweise ein paar Zeilen. 

Versuch's einfach:

import { startsWith } from lodash;

...

    if (startsWith(yourVariable, 'REP')) {
         return yourVariable;        
    return yourVariable;
       }      
     }
0
TheGabornator

Ersetzen Sie die startsWith-Funktion durch:

yourString.indexOf(searchString, position) // where position can be set to 0

Dies unterstützt alle Browser, einschließlich IE

Die Position kann auf 0 gesetzt werden, um den Abgleich von der Position 0 an zu starten.

0
Harshit Pant