Giới hạn số ký tự được phép trong trường văn bản nhập biểu mẫu

Question

Làm cách nào để giới hạn hoặc hạn chế người dùng chỉ nhập tối đa năm ký tự trong hộp văn bản?

Dưới đây là lĩnh vực đầu vào như một phần của hình thức của tôi:

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

Có sử dụng một cái gì đó giống như MAXSIZE hoặc một cái gì đó như thế?

Answer 1

maxlength:

Số ký tự tối đa sẽ được chấp nhận như là đầu vào. Điều này có thể lớn hơn được chỉ định bởi SIZE, trong trường hợp này, trường sẽ cuộn một cách thích hợp. Mặc định là không giới hạn.

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

Tuy nhiên, điều này có thể hoặc có thể không bị ảnh hưởng bởi điều khiển của bạn. Bạn có thể cần phải sử dụng hoặc thêm một hàm xử lý khác để kiểm tra độ dài, là tốt.

Answer 2

Cách đơn giản nhất để làm như vậy:

maxlength="5" 

Vì vậy .. Thêm thuộc tính này để kiểm soát của bạn:

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

Answer 3

Thêm dòng sau vào tiêu đề:

<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

Theo đến w3c, giá trị mặc định cho thuộc tính MAXLENGTH là số không giới hạn. Vì vậy, nếu bạn không chỉ định người dùng tối đa có thể cắt và dán kinh thánh một vài lần và dán nó vào biểu mẫu của bạn.

Thậm chí nếu bạn chỉ định MAXLENGTH cho một số hợp lý, hãy kiểm tra lại độ dài của dữ liệu đã gửi trên máy chủ trước khi xử lý (sử dụng một cái gì đó như php hoặc asp) vì nó khá dễ dàng để vượt qua giới hạn MAXLENGTH cơ bản nào

Answer 5

tôi nhất luôn làm điều đó như thế này:

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

Input:

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

Answer 6

làm cho nó đơn giản hơn

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

và sử dụng cảnh báo để hiển thị rằng ký tự tối đa đã được sử dụng.

Answer 7

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

số lượng tối đa các chữ cái có thể ở đầu vào là 5.

Answer 8

Bạn có thể sử dụng <input type = "text" maxlength="9"> hoặc

<input type = "number" maxlength="9"> cho số hoặc <input type = "email" maxlength="9"> cho email xác nhận sẽ hiển thị

Answer 9

maxlength

Số ký tự tối đa sẽ được chấp nhận như là đầu vào. Thuộc tính maxlength chỉ định số ký tự tối đa được phép trong phần tử.

Maxlength W3 schools

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

Output

MINLENGTH

ng-minlength

Chỉ thị ng-MINLENGTH thêm một hạn chế đến một lĩnh vực đầu vào, và đến trình xác thực của biểu mẫu.

Chỉ thị ng-minlength sẽ thêm trạng thái "không hợp lệ" của trường nhập nếu độ dài của giá trị nhỏ hơn giá trị được chỉ định.

Lưu ý: Nếu giá trị trống, giá trị được coi là hợp lệ.

<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> 

Output

Max

Thuộc tính max xác định giá trị tối đa cho một phần tử.

Mẹo: Sử dụng thuộc tính tối đa cùng với thuộc tính min để tạo một phạm vi giá trị pháp lý.

Lưu ý: Thuộc tính tối đa và phút hoạt động với các loại đầu vào sau: số, phạm vi, ngày, giờ, giờ, giờ địa phương, tháng, thời gian và tuần.

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

Output

Max and min diffrence

Min

Thuộc tính phút xác định giá trị tối thiểu cho một phần tử.

Mẹo: Sử dụng thuộc tính min cùng với thuộc tính tối đa để tạo phạm vi giá trị pháp lý.

Lưu ý: Thuộc tính tối đa và phút hoạt động với các loại đầu vào sau: số, phạm vi, ngày, giờ, giờ, giờ địa phương, tháng, thời gian và tuần.

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

Output