<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function () {
var data = [{
"Id": "SWE",
"Country": "Sweden",
"Population": 9592552
}, {
"Id": "NOR",
"Country": "Norway",
"Population": 5084190
}];
function display(e) {
alert("E" + e);
var countryData = data.find(function (element, index, array) {
return element.Id === e;
});
alert(countryData.Population);
}
display('SWE');
});
</script>
</head>
</html>
Le code affiché ci-dessus fonctionne correctement sous Firefox et Chrome, mais un message d'erreur s'affiche dans Internet Explorer. Message d'erreur:
Object doesn't support property or method 'find'
Vous utilisez la méthode JavaScript array.find()
. Notez qu'il s'agit d'un JS standard et qu'il n'a rien à voir avec jQuery. En fait, votre code entier dans la question ne fait aucun usage de jQuery.
Vous pouvez trouver la documentation de array.find()
ici: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/find
Si vous faites défiler l'écran jusqu'en bas de cette page, vous remarquerez qu'il contient des informations sur la prise en charge du navigateur et vous verrez qu'il est indiqué que IE ne prend pas en charge cette méthode.
Ironiquement, la meilleure solution consiste à utiliser jQuery, qui offre des fonctionnalités similaires prises en charge par tous les navigateurs.
Comme mentionné, array.find()
n'est pas pris en charge dans IE.
Cependant, vous pouvez lire sur un Polyfill ici:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find#Polyfill
Cette méthode a été ajoutée à la spécification ECMAScript 2015 et n'est peut-être pas encore disponible dans toutes les mises en œuvre de JavaScript. Cependant, vous pouvez polyfill Array.prototype.find avec l'extrait de code suivant:
Code:
// https://tc39.github.io/ecma262/#sec-array.prototype.find
if (!Array.prototype.find) {
Object.defineProperty(Array.prototype, 'find', {
value: function(predicate) {
// 1. Let O be ? ToObject(this value).
if (this == null) {
throw new TypeError('"this" is null or not defined');
}
var o = Object(this);
// 2. Let len be ? ToLength(? Get(O, "length")).
var len = o.length >>> 0;
// 3. If IsCallable(predicate) is false, throw a TypeError exception.
if (typeof predicate !== 'function') {
throw new TypeError('predicate must be a function');
}
// 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
var thisArg = arguments[1];
// 5. Let k be 0.
var k = 0;
// 6. Repeat, while k < len
while (k < len) {
// a. Let Pk be ! ToString(k).
// b. Let kValue be ? Get(O, Pk).
// c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
// d. If testResult is true, return kValue.
var kValue = o[k];
if (predicate.call(thisArg, kValue, k, o)) {
return kValue;
}
// e. Increase k by 1.
k++;
}
// 7. Return undefined.
return undefined;
}
});
}
Voici un travail autour. Vous pouvez utiliser le filtre au lieu de rechercher; mais le filtre retourne un tableau d'objets correspondants. find
ne renvoie que la première correspondance dans un tableau. Alors, pourquoi ne pas utiliser le filtre comme suit;
data.filter(function (x) {
return x.Id === e
})[0];
Array.prototype.find
n'est pris en charge par aucune version d'IE
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find
Juste pour le but de mentionner la recherche du soulignement la méthode fonctionne dans IE sans aucun problème.