요즘 Focus된 필드는 색깔을 표시하고 Blur될때 다시 원상복귀되는 형태의
폼들이 많이 나오고 잇네요.. 머 네이버도 부분적으로 사용하고 있는거 같고..
소스는 간단합니당. ^^;;
<style type='text/css'>
.din{border:1px solid #FF0000;}
.dout{border:1px solid #000000;}
</style>
<form name='aaa'>
<input type=text name='' onfocus='input_focus(this);' class='dout'>
<input type=text name='' onfocus='input_focus(this);' class='dout'>
</form>
<script language='javascript'>
function input_focus(obj){
$(obj).addClass('din')
.removeClass('dout')
.blur(function(){
$(this).addClass('dout')
.removeClass('din');
});
}
</script>
onfocus 이벤트를 주어서 직접 컨트롤 하는 방법과
아래의 경우처럼 클래스 셀렉터를 이용해 전체적으로 컨트롤 하는 방법이 있습니다.
<input type=text name='' class='dout'>
<input type=text name='' class='dout'>
<script language='javascript'>
$(".dout").focus(function(){
$(this).addClass('din')
.removeClass('dout')
.blur(function(){
$(this).addClass('dout')
.removeClass('din');
});
});
</script>
뭐 장단점이 있겠지만 저는 아래걸 쓰고싶네요.. html코딩도 줄어들고..
좀 이거 아이러니 한게 제가 못 찾아서 그런지는 모르겠지만..
addClass와 removeClass를 같이 써야 한다는게 참 거시기 하네요..
단일지정 함수는 없는걸까요??
javascript의 className 요녀석을 써도 괜찮을거 같은데..
댓글 4개
아랫부분은 속성을 바꿔주는 것으로 될 겁니다.
$(this).addClass('din').removeClass('dout')
->
$(this).attr("class","din");
잘쓰겠습니다~
게시판 목록
프로그램
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 2130 | 17년 전 | 1181 | ||
| 2129 |
ⓧ힘내세요
|
17년 전 | 2236 | |
| 2128 | 17년 전 | 2873 | ||
| 2127 | 17년 전 | 4056 | ||
| 2126 | 17년 전 | 3144 | ||
| 2125 | 17년 전 | 1407 | ||
| 2124 | 17년 전 | 1707 | ||
| 2123 | 17년 전 | 2238 | ||
| 2122 | 17년 전 | 1544 | ||
| 2121 | 17년 전 | 1721 | ||
| 2120 | 17년 전 | 2718 | ||
| 2119 | 17년 전 | 2144 | ||
| 2118 | 17년 전 | 1797 | ||
| 2117 |
아름다운세상
|
17년 전 | 4207 | |
| 2116 | 17년 전 | 3049 | ||
| 2115 | 17년 전 | 1435 | ||
| 2114 |
아름다운세상
|
17년 전 | 3569 | |
| 2113 | 17년 전 | 2794 | ||
| 2112 | 17년 전 | 2075 | ||
| 2111 | 17년 전 | 1292 | ||
| 2110 | 17년 전 | 2332 | ||
| 2109 | 17년 전 | 2066 | ||
| 2108 | 17년 전 | 1989 | ||
| 2107 |
휴전합시다
|
17년 전 | 1919 | |
| 2106 | 17년 전 | 1168 | ||
| 2105 |
 skinartisanCOM |
17년 전 | 1871 | |
| 2104 | 17년 전 | 2927 | ||
| 2103 | 17년 전 | 1432 | ||
| 2102 | 17년 전 | 1670 | ||
| 2101 | 17년 전 | 1354 | ||
| 2100 | 17년 전 | 1601 | ||
| 2099 | 17년 전 | 1574 | ||
| 2098 | 17년 전 | 1446 | ||
| 2097 | 17년 전 | 2559 | ||
| 2096 | 17년 전 | 2327 | ||
| 2095 | 17년 전 | 2110 | ||
| 2094 | 17년 전 | 1421 | ||
| 2093 | 17년 전 | 2432 | ||
| 2092 | 17년 전 | 4263 | ||
| 2091 | 17년 전 | 2751 | ||
| 2090 | 17년 전 | 1664 | ||
| 2089 | 17년 전 | 1856 | ||
| 2088 | 17년 전 | 3239 | ||
| 2087 | 17년 전 | 2234 | ||
| 2086 | 17년 전 | 3832 | ||
| 2085 | 17년 전 | 1679 | ||
| 2084 | 17년 전 | 2285 | ||
| 2083 | 17년 전 | 2108 | ||
| 2082 | 17년 전 | 1613 | ||
| 2081 | 17년 전 | 2128 | ||
| 2080 |
letsgolee
|
17년 전 | 1921 | |
| 2079 | 17년 전 | 1961 | ||
| 2078 | 17년 전 | 3072 | ||
| 2077 | 17년 전 | 2147 | ||
| 2076 | 17년 전 | 1441 | ||
| 2075 | 17년 전 | 1460 | ||
| 2074 | 17년 전 | 2128 | ||
| 2073 | 17년 전 | 3206 | ||
| 2072 | 17년 전 | 2137 | ||
| 2071 |
휴전합시다
|
17년 전 | 1532 | |
| 2070 | 17년 전 | 4246 | ||
| 2069 | 17년 전 | 2041 | ||
| 2068 | 17년 전 | 3460 | ||
| 2067 | 17년 전 | 6039 | ||
| 2066 | 17년 전 | 1483 | ||
| 2065 |
letsgolee
|
17년 전 | 1654 | |
| 2064 | 17년 전 | 1235 | ||
| 2063 | 17년 전 | 1349 | ||
| 2062 |
vicky
|
17년 전 | 2874 | |
| 2061 | 17년 전 | 1909 | ||
| 2060 |
카프카07
|
17년 전 | 2595 | |
| 2059 | 17년 전 | 1309 | ||
| 2058 | 17년 전 | 3184 | ||
| 2057 | 17년 전 | 2164 | ||
| 2056 | 17년 전 | 2611 | ||
| 2055 | 17년 전 | 1407 | ||
| 2054 | 17년 전 | 1758 | ||
| 2053 | 17년 전 | 1150 | ||
| 2052 |
 JCrew |
17년 전 | 1206 | |
| 2051 | 17년 전 | 1792 | ||
| 2050 | 17년 전 | 1230 | ||
| 2049 | 17년 전 | 4313 | ||
| 2048 | 17년 전 | 1512 | ||
| 2047 | 17년 전 | 2010 | ||
| 2046 |
카프카07
|
17년 전 | 7091 | |
| 2045 | 17년 전 | 1385 | ||
| 2044 | 17년 전 | 1904 | ||
| 2043 | 17년 전 | 3135 | ||
| 2042 | 17년 전 | 1227 | ||
| 2041 |
카프카07
|
17년 전 | 1986 | |
| 2040 | 17년 전 | 1166 | ||
| 2039 |
smilesol
|
17년 전 | 1854 | |
| 2038 | 17년 전 | 2155 | ||
| 2037 |
skinartisanCOM |
17년 전 | 2972 | |
| 2036 | 17년 전 | 1249 | ||
| 2035 |
 smyada |
17년 전 | 1343 | |
| 2034 |
ㅣ곰탱이ㅣ
|
17년 전 | 1564 | |
| 2033 |
 허리손반장 |
17년 전 | 1232 | |
| 2032 | 17년 전 | 4360 | ||
| 2031 | 17년 전 | 3900 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기