Ogranicz limit znaków dozwolonych w polu wprowadzania tekstu formularza

Question

W jaki sposób mogę ograniczyć lub ograniczyć użytkownika do wpisywania w polu tekstowym maksymalnie pięciu znaków?

Poniżej znajduje się pole wprowadzania jako część mojej postaci:

<input type="text" id="sessionNo" name="sessionNum" /> 

Czy używając coś podobnego maxSize czy coś takiego?

Answer 1

maxlength:

Maksymalna liczba znaków, które będą akceptowane jako dane wejściowe. Może być większa niż określona przez SIZE, w którym to przypadku odpowiednio przewinie się pole . Wartość domyślna jest nieograniczona.

<input type="text" maxlength="2" id="sessionNo" name="sessionNum" onkeypress="return isNumberKey(event)" /> 

Jednak to może być lub nie być dotknięte przez przewodnika. Może być konieczne użycie lub dodanie innej funkcji obsługi w celu przetestowania długości.

Answer 2

Najprostszym sposobem, aby to zrobić:

maxlength="5" 

Tak .. Dodanie tego atrybutu kontrolą:

<input type="text" 
    id="sessionNo" 
    name="sessionNum" 
    onkeypress="return isNumberKey(event)" 
    maxlength="5" /> 

Answer 3

Dodaj poniższe linie do nagłówka:

<script language="javascript" type="text/javascript"> 
function limitText(limitField, limitNum) { 
    if (limitField.value.length > limitNum) { 
     limitField.value = limitField.value.substring(0, limitNum); 
    } 
} 
</script> 

    <input type="text" id="sessionNo" name="sessionNum" onKeyDown="limitText(this,5);" 
onKeyUp="limitText(this,5);"" /> 

Answer 4

Według do w3c, domyślną wartością atrybutu MAXLENGTH jest liczba nieograniczona. Więc jeśli nie określisz maksimum, użytkownik może wyciąć i wkleić Biblię kilka razy i trzymać go w swoim formularzu.

Nawet jeśli podałeś MAXLENGTH do rozsądnej liczby, sprawdź dokładnie długość przesłanych danych na serwerze przed przetworzeniem (używając czegoś takiego jak php lub asp), ponieważ dość łatwo jest ominąć podstawowe ograniczenie MAXLENGTH anyway

Answer 5

I sprecyzowane zrobić to tak:

$(document).ready(function(){ 
var maxChars = $("#sessionNum"); 
var max_length = maxChars.attr('maxlength'); 
if (max_length > 0) { 
    maxChars.bind('keyup', function(e){ 
     length = new Number(maxChars.val().length); 
     counter = max_length-length; 
     $("#sessionNum_counter").text(counter); 
    }); 
} 
}); 

Wejście:

<input name="sessionNum" id="sessionNum" maxlength="5" type="text"> 
Number of chars: <span id="sessionNum_counter">5</span> 

Answer 6

uprościć

 <input type="text" maxlength="3" /> 

i użyj alertu, aby pokazać, że zostały użyte maksymalne znaki.

Answer 7

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

maksymalna liczba liter na wejściu to 5.

Answer 8

Można użyć <input type = "text" maxlength="9"> lub

<input type = "number" maxlength="9"> numerów lub <input type = "email" maxlength="9"> na email walidacji pojawi się

Answer 9

MaxLength

Maksymalna liczba znaków, które będą akceptowane jako dane wejściowe. Atrybut maxlength określa maksymalną liczbę znaków dozwoloną w elemencie.

Maxlength W3 schools

<form action="/action_page.php"> 
    Username: <input type="text" name="usrname" maxlength="5"><br> 
    <input type="submit" value="Submit"> 
    </form> 

Wyjście

MINLENGTH

ng-minlength

Dyrektywa ng-MINLENGTH dodaje ograniczenie do pola wejściowego, a do walidator formularza.

Dyrektywa ng-minlength doda "nieprawidłowy" stan pola wejściowego, jeśli długość wartości jest mniejsza niż podana.

Uwaga: Jeśli wartość jest pusta, jest uznawana za poprawną.

<form name="myForm"> 
     <input name="myInput" ng-model="myInput" ng-minlength="5"> 
     <h1 ng-if="!myForm.myInput.$valid">The value is too short</h1> 
    </form> 

wyjściowy

maksymalna

atrybut maksymalna określa maksymalną wartość dla elementu.

Wskazówka: Użyj atrybutu max wraz z atrybutem min, aby utworzyć zakres wartości prawnych.

Uwaga: Atrybuty max i min działają z następującymi rodzajami danych wejściowych: liczba, zakres, data, data/godzina, data i godzina, miesiąc, godzina i tydzień.

<form> 
     <input type="number" name="number" max="5"> 
    </form> 

wyjściowy

Max and min diffrence

min

atrybut min określa minimalną wartość dla elementu.

Wskazówka: Użyj atrybutu min wraz z atrybutem max, aby utworzyć zakres wartości prawnych.

Uwaga: Atrybuty max i min działają z następującymi rodzajami danych wejściowych: liczba, zakres, data, data/godzina, data i godzina, miesiąc, godzina i tydzień.

<form > 
    <input type="number" name="quantity" min="1"><br> 
    <input type="submit"> 
    </form> 

Wyjście