2013-07-03 128 views
11

我有一個最大長度的文本輸入:強制移動瀏覽器maxlength屬性

<input type="text" name="name" maxlength="50"> 

這一直工作在所有的桌面瀏覽器我試過很好,但最大長度似乎並不在移動瀏覽器上執行。

有沒有什麼辦法讓移動瀏覽器執行maxlength?我願意在解決方案中使用JavaScript和/或jQuery。這裏

var $input = $('input') 
$input.keyup(function(e) { 
    var max = 5; 
    if ($input.val().length > max) { 
     $input.val($input.val().substr(0, max)); 
    } 
}); 

的jsfiddle:

+1

我強烈懷疑還有其他事情在發揮。您是否在使用任何庫或框架將您的標記轉換爲移動瀏覽器的不同內容,例如jQuery Mobile? –

+0

我會第二個@MattBall說的。可能是一個腳本衝突或拋出錯誤。你看到任何js錯誤拋出? – jedmao

+0

您可以使用http://mimo84.github.io/bootstrap-maxlength/,它對於不支持maxLength屬性的瀏覽器(包括手機)使用'validate'參數。 –

回答

5
+0

在達到最大值5後是否可以禁用按鍵? –

+0

@DineshKumar其他響應之一在達到最大值後禁用按鍵。但是,不建議使用,因爲用戶將無法按退格鍵。 – mattsoave

-1
var maxLength = 10; 
var field = $('#myinput'); 
field.keydown(function(e) 
{ 
    if ($(this).val().length >= maxLength) e.preventDefault(); 
}); 
+1

一旦達到最大長度,似乎無法擊退退格。 – Trevor

-1

我建議一些更簡單。除非有足夠的空間讓它接受它,否則上述方法對我來說不起作用,或者如果我在之後立即提交,它仍然會通過信息。

if($(".input") > 20){$(".input") = input.slice(0,20)}; 
1
var max = 1 

input.addEventListener('keyup', function (event) { 
    event.target.value = event.target.value.substring(0, max) 
}) 
+0

儘管此代碼片段可能會解決問題,但[包括解釋](// meta.stackexchange.com/questions/114762/explaining-entirely-code-based-answers)確實有助於提高帖子的質量。請記住,您將來會爲讀者回答問題,而這些人可能不知道您的代碼建議的原因。也請儘量不要用解釋性註釋來擠佔代碼,這會降低代碼和解釋的可讀性! – Carpetsmoker

0
通用

jQuery的方式來執行一個形式字段的說明maxlength。 (我需要它用於sessionStorage,localStorage和param覆蓋。)爲可讀性優化的代碼。

$('input').on('change', function() { 
    var max = $(this).attr('maxlength'), 
     val = $(this).val(), 
     trimmed; 

    if (max && val) { 
    trimmed = val.substr(0, max); 
    $(this).val(trimmed); 
    } 
});