web-dev-qa-db-fra.com

Le code ne fonctionne pas IE 11, fonctionne bien dans Chrome

Le code suivant peut être exécuté sans problème dans Chrome, mais génère l'erreur suivante dans Internet Explorer 11.

L'objet ne prend pas en charge la propriété ou la méthode 'startsWith'

Je stocke l'ID de l'élément dans une variable. Quelle est la solution?

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 est une méthode standard dans la version la plus récente de JavaScript, ES6.

En regardant le tableau de compatibilité ci-dessous, nous pouvons voir qu'il est supporté par toutes les principales plates-formes actuelles, sauf versions d'Internet Explorer.

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

Vous devrez implémenter .startsWith vous-même. Voici le 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") est la meilleure méthode au lieu de startsWith.

Exemple:

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

Si cela se produit dans l'application Angular 2+, vous pouvez simplement supprimer le commentaire string polyfills dans polyfills.ts :

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

Ajouter le code ci-dessous au fichier JS a fonctionné pour moi:

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

Comme d'autres l'ont déjà dit, startsWith et endsWith font partie de ES6 et ne sont pas disponibles dans IE11. Notre société utilise toujours la bibliothèque lodash comme solution polyfill pour IE11. https://lodash.com/docs/4.17.4

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

J'ai aussi récemment fait face au problème. J'ai résolu en utilisant ^ qui est similaire à startwith dans jquery. Dire,

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

on peut utiliser

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

Ici, str est l'identifiant de l'élément.

0
User Learning

Le poste d’Oka fonctionne bien, mais il est peut-être un peu désuet. Je compris que lodash peut s’y attaquer avec une seule fonction. Si vous avez installé lodash, cela peut vous faire économiser quelques lignes. 

Essayez juste:

import { startsWith } from lodash;

...

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

Remplace la fonction startsWith par:

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

Ceci supportera tous les navigateurs, y compris IE

La position peut être définie sur 0 pour commencer la correspondance à partir du début, ce qui signifie 0e position.

0
Harshit Pant