일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- PHP
- 소득세
- flash
- 인테리어그림
- .NET
- 갑근세
- HTML
- CSS
- oralce
- Administrator
- MSSQL
- 국민연금
- Vista
- 블루수국그림
- CVS
- Jrun
- IIS
- JSP
- Eclipse
- 에덴미술
- Jexcel
- 블로그 방문자 늘리기
- 즐겨찾기 추가
- samba
- 블로그 조회수 늘리기
- 블로그 수익화
- MySQL
- 블로그 조회수
- Adobe pdf reader
- JavaScript
- Today
- Total
I LOVE EJ
jQuery 1.4 추가사항 - .focusin(), .focusout() 본문
jQuery 1.3.2 버전에서 존재하던 .focus() 이벤트를 업그레이드 한 것으로 해당 input 요소에 focus가 들어갔을때 와 나왔을때에 이벤트가 발쌩하는 기능입니다.
기본적인 사용법
.focusout( handler(eventObject) )
handler(eventObject)는 이벤트가 발생할 때 마다 수행할 이벤트 오프젝트나 함수를 지정해 주시면됩니다.
예제를 보시면 쉽게 이해할 수 있으실듯 합니다.
예제 : http://coterie.hosting.paran.com/focus/
예제 소스
[code]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-Transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ko" lang="ko">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<title>테스트</title>
<script type="text/javascript" src="/js/jquery-1.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input[name=test1]").focusin(function(){
$("span:first").text('포커스인').show().fadeOut('slow');
}).focusout(function(){
$("span:first").text('포커스아웃').show().fadeOut('slow');
});
$("input[name=test2]").focusin(function(){
$("span:last").text('포커스인').show().fadeOut('slow');
}).focusout(function(){
$("span:last").text('포커스아웃').show().fadeOut('slow');
});
});
</script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<input name="test1" value="" /><span></span><br />
<input name="test2" value="" /><span></span>
</body>
</html>[/code]
'Web publishing > jQuery' 카테고리의 다른 글
눈여겨 볼만한 jQuery 플러그인 (0) | 2013.05.07 |
---|---|
CSS Tab Navigation + List Item Navigation. (0) | 2013.03.28 |
[jQuery] PNG투명 이미지 animate시 IE7,8 투명이미지 표현 문제. (0) | 2013.03.26 |
[Jquery] Show each Easing Method (0) | 2013.03.26 |
[Library] zeroclipboard (0) | 2013.03.21 |