2014-12-05 10 views
5

w Safari w wersji 8.0 (10600.1.25.1) na OS X 10.10.1 jeśli masz następujące:Czy istnieje obejście maksymalnego czasu wprowadzania tekstu, które nie działa w przeglądarce Safari?

<input type="text" maxlength="5" > 

Wypełnij go z 5 znaków, a następnie umieść daszka (z myszy lub klawiatury) gdzieś w w środku ciągu (nie na samym początku lub na końcu), pisanie spowoduje wprowadzenie większej liczby znaków.

W szczególności działa tak, jakby ignorował znaki po kurcie podczas obliczania "długości" struny, więc jeśli karetka została pierwotnie umieszczona na pozycji 1, zostanie wprowadzonych 9 znaków.

Nie można tego odtwarzać na najnowszych produktach chromowych ani firefox.

Efekt można zobaczyć na tej stronie: http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_input_maxlength

używam maxLength źle? Czy jest to znane z obejścia? Mam googled trochę bez radości ...

+2

Zostało to poprawione w Safari 9.0, tymczasem ja naklejane roztworem toto21 za MAXLENGTH w Safari 8. –

+0

dobrą wiadomością, dzięki za dzielenie się. :) – MHarris

Odpowiedz

7

Spróbuj tego: HTML:

<input name="mytest" type="text"> 

jQuery:

$('input[name="mytest"]').keypress(function() { 
    if (this.value.length >= 5) { 
     return false; 
    } 
}); 
+0

Powoduje to błąd w Firefoksie, po osiągnięciu maksymalnej liczby znaków nie można użyć tabulatora lub [CTRL + A], a delete/backspace nie działa. Zatrzymuje wszystkie działania znaków drukowalnych i niedrukowalnych. – Larrydx

+0

Rzeczywiście! - Więc użyj keydown w ten sposób: $ ('input [nazwa = "mytest"]') keydown (funkcja (e) { \t \t // alkert.e.keyCode); if (e.keyCode! = 8 && this.value.length> = 5) { return false; } }); – toto21

+1

Lepiej: sprawdź, czy przeglądarka jest w Safari, a wersja <9 – toto21

0

miałem podobny problem, po wielu badaniach, Regały mózgowe i pomoc z tej strony, to jest to, co zrobiłem. Zapobiega występowaniu wszystkich błędów [CTRL + A], backspace/delete w Firefoksie. Działa dobrze dla mnie. Może pracować dla kogoś innego. Przepraszam za zanieczyszczenie przestrzeni globalnej.

function getBrowserInfo() { 
    //function that returns an array with browser name at index 0, version at index 1 
    var N=navigator.appName, ua=navigator.userAgent, tem; 
    var M=ua.match(/(opera|chrome|safari|firefox|msie)\/?\s*(\.?\d+(\.\d+)*)/i); 

    if(M && (tem= ua.match(/version\/([\.\d]+)/i))!= null) { 
     M[2]= tem[1]; 
    } 

    M = M ? [M[1], M[2]]: [N, navigator.appVersion, '-?']; 

    return M; 
} 

function crossBrowserify() { 
     //checks for browsers that lack support and adds the handler leaving compatible browsers like Firefox unaffected 
     var browserInfoArr = getBrowserInfo(), 
     browser = browserInfoArr[0], 
     browserVersion = browserInfoArr[1]; 

     if(browser.toLowerCase() == "safari" && browserVersion >= 8 && browserVersion < 9) { 
      $(document).on("keypress", "input[type='text']", preventExcessCharacters); 
     } 
    } 

function preventExcessCharacters(e) { 
     //fix for a bug in Mac OSX Safari 8 
     var $this = $(this), //caching element to prevent performance issues due to frequent DOM access 
      mxLength = $this.attr("maxlength"); 

     if(mxLength){ 
      if (e.which < 0x20) { 
       // e.which < 0x20, then it's not a printable character 
       // e.which === 0 - Not a character 
       return;  // Do nothing 
      } 
      if (this.value.length == mxLength) { 
       e.preventDefault(); 
      } else if (this.value.length > mxLength) { 
       // Maximum exceeded 
       // fix for copy paste bug 
       this.value = this.value.substring(0, mxLength); 
      } 
     } 

    } 

//set handler if browser lacks support 
crossBrowserify(); 
Powiązane problemy