인풋 maxlengh 가 먹히지 않아 문의드립니다.
본문
게시판에서 버튼을 눌러 인풋을 입력하는 폼을 만들고 있습니다.
인풋에 maxlengh 를 4자리로 설정했는데도 끝없이 입력되어서 최대 4자리만 입력되게 하고 싶습니다.
조언 부탁드립니다.
그리고 readonly 로 했더니 required 가 적용이 되지 않아서, 선택 안되게 하고 싶은데 어떤 방법이 있을까요.
<table style="text-align: center;
margin-left: auto;
margin-right: auto;">
<input type="tel" readonly="readonly" maxlength="4" min="4" id="exp" name="wr_3" value="<?php echo $wr_3 ?>" size="20" placeholder="전화번호 마지막 4자리" style="font-family: 'Exo 2', sans-serif; font-size: 50px; text-align: center;" required ></br></br>
<tr>
<td> <input type="button" onfocus="this.blur()" value=" 1 " onClick="enter_exp(document.fwrite.exp,' 1 ')" class="ddd btn-4" readonly="readonly"></td>
<td> <input type="button" onfocus="this.blur()" value=" 2 " onClick="enter_exp(document.fwrite.exp,' 2 ')" class="ddd btn-4" readonly="readonly"></td>
<td><input type="button" onfocus="this.blur()" value=" 3 " onClick="enter_exp(document.fwrite.exp,' 3 ')" class="ddd btn-4" readonly="readonly"></td>
<td><input type="button" onfocus="this.blur()" value=" ← " onClick="enter_exp(document.fwrite.exp,' ← ')" class="ddd btn-4" readonly="readonly"></td>
</tr>
<tr>
<td><input type="button" onfocus="this.blur()" value=" 4 " onClick="enter_exp(document.fwrite.exp,' 4 ')" class="ddd btn-4" readonly="readonly"></td>
<td><input type="button" onfocus="this.blur()" value=" 5 " onClick="enter_exp(document.fwrite.exp,' 5 ')" class="ddd btn-4" readonly="readonly"></td>
<td><input type="button" onfocus="this.blur()" value=" 6 " onClick="enter_exp(document.fwrite.exp,' 6 ')" class="ddd btn-4" readonly="readonly"></td>
<td rowspan="3"><input type = "button" onfocus="this.blur()" value= " C " onClick="clear_exp(document.fwrite.exp)" class="btn-4" style="width:70px; height: 216px; font-size: 30px;"></td>
</tr>
<tr>
<td><input type="button" onfocus="this.blur()" value=" 7 " onClick="enter_exp(document.fwrite.exp,' 7 ')" class="ddd btn-4" readonly="readonly"></td>
<td> <input type="button" onfocus="this.blur()" value=" 8 " onClick="enter_exp(document.fwrite.exp,' 8 ')" class="ddd btn-4" readonly="readonly"></td>
<td> <input type="button" onfocus="this.blur()" value=" 9 " onClick="enter_exp(document.fwrite.exp,' 9 ')" class="ddd btn-4" readonly="readonly"></td>
</tr>
<tr>
<td colspan="3"><input type="button" onfocus="this.blur()" value=" 0 " onClick="enter_exp(document.fwrite.exp,' 0 ')" class="btn-4" style=" width:216px; height: 70px; font-size: 30px;" readonly="readonly"></td>
</tr>
</table>
<script LANGUAGE="JavaScript">
function enter_exp(p,str){
if(str==" ← ") p.value = p.value.substring(0, p.value.length-3);
else p.value+=str;
}
function clear_exp(p){
p.value=""
}
</script>
답변 2
maxlength 가 있는 input 은 별도 스크립트에서 글자수를 관리하고 있는건 아닌지 생각됩니다.
해당 페이지에 별도로 테스트 input 을 새로 만드셔서 maxlength 를 테스트 해보세요.
오타입니다. maxlength 로 해보세요.
- 다시보니 본문 소스는 제대로 되어있네요. 해당 부분을 input 제일 끝으로 옮겨보세요.
required 의 경우 클래스를 required 로 잡아보세요.
maxlength 제일 끝으로 옮겨도 마찬가지로 적용이 되지는 않네요 ㅠㅠ
required 는 readonly를 타입으로 줘버리니 적용이 되고 있습니다.
답변 감사합니다.
답변을 작성하시기 전에 로그인 해주세요.
