Có cách giải quyết nào cho maxlength văn bản không hoạt động trong Safari không?

Question

trong Safari phiên bản 8.0 (10600.1.25.1) trên OS X 10.10.1 nếu bạn có điều sau đây:

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

Điền nó với 5 ký tự, và sau đó vị trí caret (với chuột hoặc bàn phím) ở đâu đó trong giữa chuỗi (không phải ở đầu hoặc cuối), việc nhập sẽ khiến nhiều ký tự được nhập vào.

Cụ thể, nó hoạt động như nó bỏ qua các ký tự sau dấu mũ khi tính "độ dài" của chuỗi, vì vậy nếu dấu mũ ban đầu được đặt ở vị trí 1, 9 ký tự sẽ được nhập.

Điều này không thể sao chép được trên chrome hoặc firefox mới nhất.

Hiệu quả có thể được nhìn thấy trên trang này: http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_input_maxlength

Tôi có sử dụng maxlength sai? Đây có phải là một điều được biết với cách giải quyết? Tôi đã googled một chút không có niềm vui ...

Answer 1

Hãy thử điều này: HTML:

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

Jquery:

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

Answer 2

Tôi đã có một vấn đề tương tự, sau rất nhiều nghiên cứu, não kệ và giúp đỡ từ trang web này, đây là những gì tôi đã làm. Nó ngăn cản việc chọn tất cả [CTRL + A], backspace/delete bugs xuất hiện trong Firefox. Làm việc tốt cho tôi. Có thể làm việc cho người khác nữa. Xin lỗi về sự ô nhiễm không gian tên toàn cầu.

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();