IT박스

양식 입력 텍스트 필드에 허용되는 문자 수 제한

itboxs 2020. 8. 5. 08:03
반응형

양식 입력 텍스트 필드에 허용되는 문자 수 제한


텍스트 상자에 최대 5자를 입력하도록 사용자를 제한하거나 제한하는 방법은 무엇입니까?

아래는 내 양식의 일부로 입력 필드입니다.

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

maxSize 또는 이와 유사한 것을 사용하고 있습니까?


최대 길이 :

입력으로 허용되는 최대 문자 수입니다. 이것은 SIZE로 지정된 것보다 클 수 있으며,이 경우 필드가 적절히 스크롤됩니다. 기본값은 무제한입니다.

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

그러나 이것은 처리기에 영향을받을 수도 있고받지 않을 수도 있습니다. 길이를 테스트하기 위해 다른 핸들러 함수를 사용하거나 추가해야 할 수도 있습니다.


가장 간단한 방법 :

maxlength="5"

따라서 ..이 속성을 컨트롤에 추가 :

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

헤더에 다음을 추가하십시오.

<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);"" />

w3c 에 따르면 MAXLENGTH 속성의 기본값은 무제한입니다. 따라서 최대 값을 지정하지 않으면 사용자가 성경을 몇 번 잘라 붙여 넣어 양식에 붙일 수 있습니다.

MAXLENGTH를 합리적인 수로 지정하더라도 처리하기 전에 (php 또는 asp와 같은 것을 사용하여) 서버에서 제출 된 데이터의 길이를 다시 확인하여 기본 MAXLENGTH 제한을 극복하는 것이 매우 쉽습니다.


더 간단하게

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

최대 문자가 사용되었음을 알리는 경고를 사용하십시오.


나는 항상 이렇게 이렇게 :

$(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 name="sessionNum" id="sessionNum" maxlength="5" type="text">
Number of chars: <span id="sessionNum_counter">5</span>

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

입력 할 수있는 최대 문자 수는 5입니다.


최대 길이

입력으로 허용되는 최대 문자 수입니다. maxlength 속성은 요소에 허용되는 최대 문자 수를 지정합니다.

Maxlength W3 학교

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

You can use <input type = "text" maxlength="9"> or

<input type = "number" maxlength="9"> for numbers or <input type = "email" maxlength="9"> for email validation will show up


<input type="number" id="xxx" name="xxx" oninput="maxLengthCheck(this)" maxlength="10">

function maxLengthCheck(object) {
  if (object.value.length > object.maxLength)
  object.value = object.value.slice(0, object.maxLength)
}

참고URL : https://stackoverflow.com/questions/8545376/limit-number-of-characters-allowed-in-form-input-text-field

반응형