.trim () w JavaScript nie działa w IE

460

Próbowałem zastosować .trim()ciąg znaków w jednym z moich programów JavaScript. Działa poprawnie pod Mozillą, ale błąd pojawia się, gdy próbuję go w IE8. Czy ktoś wie, co się tutaj dzieje? Czy w każdym razie mogę sprawić, by działało w IE?

kod:

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

wyświetlanie błędów:

Wiadomość: Obiekt nie obsługuje tej właściwości lub metody
Linia: 604
Char: 2
Kod: 0
URI: http: //test.localhost/test.js
Jin Yong
źródło
2
Nie widzę, co jest przechowywane na twoim komputerze. Czy możesz przesłać test.js na stronę z pamięcią masową? Ponadto muszę zobaczyć rzeczywistą funkcję trim (), aby zobaczyć, co jest nie tak. Dzięki!
Warty
6
@ItzWarty "whatever ".trim()spróbuj tego na IE8.
Dan Rosenstark
8
Poszukałem kompatybilności z IE8 trim()i nie uwierzyłem własnym oczom, kiedy zorientowałem się, że to nie jest obsługiwane. Dzięki za wyjaśnienie. Chciałem zapytać tak samo jak ty.
Mathias Lykkegaard Lorenzen

Odpowiedzi:

773

Dodaj następujący kod, aby dodać funkcję przycinania do łańcucha.

if(typeof String.prototype.trim !== 'function') {
  String.prototype.trim = function() {
    return this.replace(/^\s+|\s+$/g, ''); 
  }
}
Ben Rowe
źródło
8
Dobra odpowiedź. Pamiętaj, że replace(/^\s\s*/, '').replace(/\s\s*$/, '')powinno to być około 3 razy szybsze niż replace(/^\s+|\s+$/, '')w Firefoksie 2, według jednego testu: blog.stevenlevithan.com/archives/faster-trim-javascript
Daniel Vassallo
92
Należy również pamiętać, że replace(/^\s+|\s+$/, '')usuwa tylko spacje początkowe lub końcowe, co nie jest oczekiwanym działaniem funkcji przycinania. Jeśli chcesz usunąć zarówno początkowe, jak i końcowe spacje, musisz użyć replace(/^\s+|\s+$/g, '').
Massimiliano Fliri
1
Wydaje mi się to trochę głupie. Czy nie każdy framework js zapewnia użyteczną funkcję trim ()? Jeśli jest to jedyny problem, jaki masz, to dobrze, ale jest wiele sposobów, że IE jest „inny”, dzięki czemu biblioteka będzie warta spędzenia czasu w krótkim okresie.
Stephen
6
@Stephen Tak, masz rację, ale pytanie nie dotyczy ram. chodzi o javascript & trim.
Ben Rowe
3
To dobre rozwiązanie, jeśli nie używasz jQuery. Ale jeśli nie, $ .trim () wydaje się być znacznie lepszym rozwiązaniem, ponieważ sprawia, że ​​twój skrypt jest nieco prostszy.
NLemay
203

Wygląda na to, że ta funkcja nie jest zaimplementowana w IE. Jeśli używasz jQuery, możesz użyć $.trim()zamiast tego ( http://api.jquery.com/jQuery.trim/ ).

jrummell
źródło
17
Teraz uwielbiam jQuery, ale importowanie go tylko dla .trim () wydaje się przesadzone
Erik
71
Zgadzam się. Dlatego powiedziałem „jeśli używasz jQuery ...” =)
jrummell
@Erik, czy to będzie jedyny problem z IE, na który wpadnie Jin? Nie ma wiele przydatnych javascript, które mogę napisać bez konieczności korzystania z funkcji dezynfekcji przeglądarki biblioteki.
Stephen
8
Należy pamiętać, że $ .trim () różni się od $ (<element> .val (). Trim () - więcej informacji tutaj: stackoverflow.com/questions/4315570/…
sami
57

jQuery:

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

Ktoś używa, $("#mycomment").val().trim();ale to nie będzie działać w IE.

Dan
źródło
1
Dziękuję za idealną odpowiedź, która uratowała nam wiele bólów głowy na tym zgniłym, starym, chwiejnym moście Browser :)
Awerealis
1
Świetny przykład, dlaczego jQuery.
Andrew Plummer,
Czy ta metoda działa w różnych przeglądarkach, Sir?
toha
2
@toha, bycie przeglądarką to jedna z kluczowych rzeczy w jQuery
Raystorm
Prawidłowy Sir. Zgaduję. Dzięki
toha,
34

Niestety nie ma obsługi JavaScript w przeglądarce dla trim ().

Jeśli nie używasz jQuery (która ma metodę .trim ()), możesz użyć następujących metod, aby dodać obsługę przycinania do ciągów:

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
źródło
8

Miałem podobny problem, gdy próbowałem przyciąć wartość z danych wejściowych, a następnie zapytać, czy jest ona równa zeru:

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

Jednak to rzuciło kluczem w pracach dla IE6 - 8. Irytujące było, że starałem się go tak przerobić:

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

Jednak metoda przycinania jQuery działa dla mnie idealnie we wszystkich przeglądarkach.

var originalValueTrimmed = $.trim($(this).val());              
            if (originalValueTrimmed  == "") { ... }
kaichanvong
źródło
5

Napisałem kod do implementacji funkcji przycinania.

LTRIM (wykończenie po lewej):

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

RTRIM (wykończenie po prawej):

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

WYKOŃCZENIE (przycinanie po obu stronach):

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

LUB

Dostępne jest również wyrażenie regularne, którego możemy użyć.

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

Przydatne wyjaśnienie

shiv.mymail
źródło
3
Twoja stara szkoła wyszukać i zniszczyć kod nie obsługuje \t, \r, \ni takie. Tylko spaces. Regexp jest lepszy, jeśli nie masz ochoty na ręczną obsługę wszystkiego.
CodeAngry
4

Możemy uzyskać oficjalny kod z Internetu! Zobacz to:

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

Uruchomienie następującego kodu przed jakimkolwiek innym kodem spowoduje utworzenie funkcji trim (), jeśli nie jest natywnie dostępna.

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, '');
    };
  })();
}

więcej: Właśnie znalazłem projekt js do obsługi EcmaScript 5: https://github.com/es-shims/es5-shim czytając kod źródłowy, możemy uzyskać więcej wiedzy na temat 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
źródło
3

Nie sądzę, że istnieje natywna trim()metoda w standardzie JavaScript. Może Mozilla dostarcza jeden, ale jeśli chcesz go w IE, musisz go napisać sam. Na tej stronie znajduje się kilka wersji .

JW.
źródło
3

Miałem ten sam problem w IE9 Jednak kiedy zadeklarowałem obsługiwaną wersję HTML z następującym znacznikiem w pierwszym wierszu przed

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

Problem został rozwiązany.

znak
źródło
1

Jest to spowodowane błędem literówka getElementBy ID . Zmień to na getElementById

Jobelle
źródło
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
źródło
1
Po co robić pętlę, gdy można użyć prostej zamiany, a także jej bardzo źle, gdy czas jest krytyczny, spróbuj wywołać tę metodę 200 razy tekstu średniej wielkości i wywołać inną implementację dostarczoną przez jQuery, a zobaczysz o czym mówię: )
Dany Khalife
1
Ponieważ w niektórych przypadkach pętla jest szybsza niż wyrażenie regularne. Zobacz link opublikowany przez JW w odpowiedzi na niektóre testy porównawcze, zwłaszcza komentarze tam zawarte (ponieważ oryginalny test porównawczy jest dość stary).
Eric,
0

Właśnie dowiedziałem się, że IE przestaje obsługiwać trim(), prawdopodobnie po ostatniej aktualizacji systemu Windows. Jeśli używasz dojo, możesz go używać dojo.string.trim(), działa na wielu platformach.

David Zhao
źródło
0

Ten problem może być spowodowany przez IE korzystający z trybu zgodności w witrynach intranetowych. Istnieją dwa sposoby rozwiązania tego problemu: możesz zaktualizować IE, aby nie korzystał z trybu zgodności na komputerze lokalnym (w IE11: Narzędzia-> Ustawienia widoku zgodności -> Odznacz opcję Wyświetl witryny intranetowe w widoku zgodności)

Jeszcze lepiej możesz zaktualizować metatagi na swojej stronie. Dodać:

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

Co to znaczy? Mówi IE, aby używał najnowszego trybu zgodności. Więcej informacji jest dostępnych w MSDN: Określanie starszych trybów dokumentów

FuzzyJulz
źródło