.trim () en JavaScript ne fonctionne pas dans IE

460

J'ai essayé d'appliquer .trim()à une chaîne dans l'un de mes programmes JavaScript. Cela fonctionne bien sous Mozilla, mais une erreur s'affiche lorsque je l'essaye dans IE8. Quelqu'un sait-il ce qui se passe ici? Est-il possible de le faire fonctionner dans IE?

code:

var ID = document.getElementByID('rep_id').value.trim();

affichage d'erreur:

Message: l'objet ne prend pas en charge cette propriété ou cette méthode
Ligne: 604
Caractère: 2
Code: 0
URI: http: //test.localhost/test.js
Jin Yong
la source
2
Je ne vois pas ce qui est stocké sur votre ordinateur. Pourriez-vous télécharger test.js sur un site Web de stockage? De plus, j'ai besoin de voir la fonction trim () pour voir ce qui ne va pas. Merci!
Warty
6
@ItzWarty "whatever ".trim()essayez cela sur IE8.
Dan Rosenstark
3
Pour info
Grim
8
J'ai recherché la compatibilité IE8 sur Google trim(), et je n'en croirais pas mes yeux quand j'ai compris qu'elle n'était pas prise en charge. Merci d'avoir clarifié cela. J'allais demander la même chose que vous avez demandé.
Mathias Lykkegaard Lorenzen

Réponses:

773

Ajoutez le code suivant pour ajouter une fonctionnalité de découpage à la chaîne.

if(typeof String.prototype.trim !== 'function') {
  String.prototype.trim = function() {
    return this.replace(/^\s+|\s+$/g, ''); 
  }
}
Ben Rowe
la source
8
Bonne réponse. Notez que cela replace(/^\s\s*/, '').replace(/\s\s*$/, '')devrait être environ 3 fois plus rapide que replace(/^\s+|\s+$/, '')dans Firefox 2, selon une référence: blog.stevenlevithan.com/archives/faster-trim-javascript
Daniel Vassallo
92
Notez également que replace(/^\s+|\s+$/, '')ne supprime que les espaces de début ou de fin, ce qui n'est pas le comportement attendu d'une fonction de découpage. Si vous souhaitez supprimer les espaces de début et de fin, vous devez utiliser replace(/^\s+|\s+$/g, '').
Massimiliano Fliri
1
Cela me semble un peu idiot. Chaque framework js ne fournit-il pas une fonction utilitaire trim ()? Si c'est le seul problème que vous avez, alors très bien, mais il existe de nombreuses façons dont IE est "différent" qui rendra une bibliothèque utile à court terme.
Stephen
6
@Stephen Oui, vous avez raison, mais la question ne concerne pas les frameworks. il s'agit de javascript & trim.
Ben Rowe
3
C'est une bonne solution si vous n'utilisez pas jQuery. Sinon, $ .trim () semble être une bien meilleure solution, car il maintient votre script un peu plus simple.
NLemay
203

Il semble que cette fonction ne soit pas implémentée dans IE. Si vous utilisez jQuery, vous pouvez utiliser à la $.trim()place ( http://api.jquery.com/jQuery.trim/ ).

jrummell
la source
17
Maintenant, j'aime jQuery, mais l'importer juste pour .trim () semble exagéré
Erik
71
Je suis d'accord. C'est pourquoi j'ai dit "si vous utilisez jQuery ..." =)
jrummell
@Erik, est-ce que ce sera le seul problème IE que Jin va rencontrer? Il n'y a pas beaucoup de javascript utile que je peux écrire sans avoir à utiliser les fonctions de nettoyage du navigateur d'une bibliothèque.
Stephen
8
Veuillez noter que $ .trim () est différent de $ (<element> .val (). Trim () - plus d'informations ici: stackoverflow.com/questions/4315570/…
sami
57

jQuery:

$.trim( $("#mycomment").val() );

Quelqu'un utilise $("#mycomment").val().trim();mais cela ne fonctionnera pas sur IE.

Dan
la source
1
Merci pour une réponse parfaite qui nous a évité de nombreux maux de tête ici sur ce vieux pont de navigateur fragile et pourri :)
Awerealis
1
Un excellent exemple de la raison pour laquelle jQuery.
Andrew Plummer
Cette méthode est-elle multi-navigateur, monsieur?
toha
2
@toha, être un navigateur croisé est l'un des éléments clés de jQuery
Raystorm
Correct monsieur. J'imagine. Merci
toha
34

Malheureusement, il n'y a pas de prise en charge JavaScript par plusieurs navigateurs pour trim ().

Si vous n'utilisez pas jQuery (qui a une méthode .trim ()), vous pouvez utiliser les méthodes suivantes pour ajouter un support de découpage aux chaînes:

String.prototype.trim = function() {
    return this.replace(/^\s+|\s+$/g,"");
}
String.prototype.ltrim = function() {
    return this.replace(/^\s+/,"");
}
String.prototype.rtrim = function() {
    return this.replace(/\s+$/,"");
}
Iain Collins
la source
8

J'ai eu un problème similaire en essayant de couper une valeur à partir d'une entrée et de demander ensuite si elle était égale à rien:

if ($(this).val().trim() == "")

Cependant, cela a jeté une clé dans les travaux pour IE6 - 8. Assez ennuyeusement, j'ai essayé de le varier comme suit:

   var originalValue = $(this).val();

Cependant, en utilisant la méthode de découpage de jQuery, cela fonctionne parfaitement pour moi dans tous les navigateurs.

var originalValueTrimmed = $.trim($(this).val());              
            if (originalValueTrimmed  == "") { ... }
kaichanvong
la source
5

J'ai écrit du code pour implémenter la fonctionnalité Trim.

LTRIM (trim à gauche):

function ltrim(s)
{
    var l=0;
    while(l < s.length && s[l] == ' ')
    {   l++; }
    return s.substring(l, s.length);
} 

RTRIM (trim à droite):

function rtrim(s)
{
    var r=s.length -1;
    while(r > 0 && s[r] == ' ')
    {   r-=1;   }
    return s.substring(0, r+1);
 }

TRIM (couper les deux côtés):

function trim(s)
{
    return rtrim(ltrim(s));
}

OU

L'expression régulière est également disponible que nous pouvons utiliser.

function trimStr(str) {
  return str.replace(/^\s+|\s+$/g, '');
}

Explication utile

shiv.mymail
la source
3
Votre ancienne école de recherche et de détruire le code ne gère pas \t, \r, \net tel. Seulement spaces. Regexp est meilleur si vous n'avez pas vraiment envie de tout faire manuellement.
CodeAngry
4

Nous pouvons obtenir le code officiel sur Internet! Référez ceci:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/trim

L'exécution du code suivant avant tout autre code créera trim () s'il n'est pas nativement disponible.

if (!String.prototype.trim) {
  (function() {
    // Make sure we trim BOM and NBSP
    var rtrim = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;
    String.prototype.trim = function() {
      return this.replace(rtrim, '');
    };
  })();
}

pour en savoir plus: Je viens de découvrir qu'il existe un projet js pour la prise en charge d'EcmaScript 5: https://github.com/es-shims/es5-shim en lisant le code source, nous pouvons obtenir plus de connaissances sur le trim.

defineProperties(StringPrototype, {
 // http://blog.stevenlevithan.com/archives/faster-trim-javascript
 // http://perfectionkills.com/whitespace-deviations/
  trim: function trim() {
    if (typeof this === 'undefined' || this === null) {
      throw new TypeError("can't convert " + this + ' to object');
    }
    return String(this).replace(trimBeginRegexp, '').replace(trimEndRegexp, '');
  }
}, hasTrimWhitespaceBug);
Will V King
la source
3

Je ne pense pas qu'il existe une trim()méthode native dans la norme JavaScript. Peut-être que Mozilla en fournit un, mais si vous en voulez un dans IE, vous devrez l'écrire vous-même. Il existe quelques versions sur cette page .

JW.
la source
3

J'ai eu le même problème dans IE9 Cependant, lorsque j'ai déclaré la version html prise en charge avec la balise suivante sur la première ligne avant le

<!DOCTYPE html>
<HTML>
<HEAD>...
.
.

Le problème a été résolu.

marque
la source
1

C'est à cause de l'erreur de faute de frappe getElementBy ID . Remplacez-le par getElementById

Jobelle
la source
0
var res = function(str){
    var ob; var oe;
    for(var i = 0; i < str.length; i++){
        if(str.charAt(i) != " " && ob == undefined){ob = i;}
        if(str.charAt(i) != " "){oe = i;}
    }
    return str.substring(ob,oe+1);
}
Dhaval dave
la source
1
Pourquoi faire une boucle lorsque vous pouvez utiliser un simple remplacement, c'est aussi très mauvais lorsque le temps est crutial, essayez d'appeler cette méthode 200 fois sur du texte de taille moyenne et d'appeler l'autre implémentation fournie par jQuery et vous verrez de quoi je parle: )
Dany Khalife
1
Parce que dans certains cas, une boucle est plus rapide qu'une expression rationnelle. Voir le lien que JW a posté dans sa réponse pour certains benchmarks, en particulier les commentaires (car le benchmark d'origine est assez ancien).
Eric
0

Je viens de découvrir qu'IE cesse de prendre en charge trim(), probablement après une récente mise à jour de Windows. Si vous utilisez dojo, vous pouvez l'utiliser dojo.string.trim(), cela fonctionne sur plusieurs plateformes.

David Zhao
la source
0

Ce problème peut être provoqué par IE en utilisant le mode de compatibilité sur les sites intranet. Il existe deux façons de résoudre ce problème, vous pouvez soit mettre à jour IE pour ne pas utiliser le mode de compatibilité sur votre ordinateur local (dans IE11: Outils-> Paramètres d'affichage de compatibilité -> Décocher Afficher les sites intranet dans l'affichage de compatibilité)

Mieux encore, vous pouvez mettre à jour les balises META dans votre page Web. Ajouter à:

...
<head>
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
</head>
...

Qu'est-ce que ça veut dire? Il indique à IE d'utiliser le dernier mode de compatibilité. Plus d'informations sont disponibles dans MSDN: Spécification des modes de document hérités

FuzzyJulz
la source