이벤트가 실행되는 것을 특정 조건에 맞춰서 진행할 수 있다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="../../js/jquery-3.5.1.min.js"></script>
<script>
function checkName(event){
var charCode = event.charCode;
if(charCode < 97 || charCode > 122){ // 소문자 이외에은 입력을 방지
event.preventDefault();
alert("소문자만 입력할 수 있습니다.");
}
}
$(document).ready(function(){
});
</script>
</head>
<body>
<p>이름을 소문자로 입력해주세요.</p>
<form>
<input type="text" onkeypress="checkName(event);">
</form>
</body>
</html>해당 텍스트창에 소문자만 입력(사실 대문자만 입력이 안되는) 프로그램을 작성을 했다.
대문자가 입력되려고하면 팝업창으로 제한을 알려주는 문구가 뜬다.
728x90
반응형
'HTML > Javascript 기초' 카테고리의 다른 글
| [Javascript] 버블링 기초 - 1 (0) | 2020.08.05 |
|---|---|
| [Javascript] 이벤트 방해하기 (0) | 2020.08.05 |
| [Javascript] 이벤트 중복 실행 방지하기 (0) | 2020.08.05 |
| [Javascript] 이벤트 단계 (0) | 2020.08.05 |
| [Javascript] 이벤트 흐름 (0) | 2020.08.05 |
