2013년 10월 23일 수요일

(제이쿼리jquery 강좌)jQuery를 통한 키보드 이벤트, keydown, keyup, keypress jQuery를 통한 키보드 이벤트

(제이쿼리jquery 강좌)jQuery를 통한 키보드 이벤트, keydown, keyup, keypress


jQuery를 통한 키보드 이벤트

keydown : 키 눌러질때,   keypress:글자가입력될때
keyup : 키보드가 떨어질 때

<script type="text/javascript">
$(document).ready(function() {
//keydown 이벤트가발생한순간에는글자가입력되어있지않음
//입력한글자수를표시해야하므로keyup 이벤트사용
$("textarea").keyup(function () {
//남은 글자수 구합니다.
var inputLength = $(this).val().length;
var remain = 50 ? inputLength;
//남은 글자수 display
$("h1").html(remain);
//문서객체 색상 변경
if (remain >= 0) {
$("h1").css("color","Blue");
} else {
$("h1").css("color","red")
}
});
});
</script>
<body><div>
<p>지금 내 생각을</p>
<h1>50</h1>
<textarea cols="40" rows="5"></textarea>
</div>
</body>



[기타 다른 강좌는 아래 해당 카테고리를 클릭해주세요]

 

작성자: 시간:
라벨: , , , , , , , ,

댓글 없음:

댓글 쓰기

피드 구독하기: 댓글 (Atom)