<!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" >
<head>
<style>
.reverse
{
background : Black;
color : White;
}
</style>
<script src="http://code.jquery.com/jquery-1.7.min.js"></script>
<script>
$.noConflict();
var J = jQuery;
J(function () {
//이벤트 연결( 해당 태그 클릭시 문자"+" 추가 )
J("h1").bind("click", function () {
J(this).html(function (index, html) {
return html + "+";
});
});
//이벤트 연결
J("h1").bind({
//마우스 올리면(style 적용)
mouseenter: function () { J(this).addClass("reverse"); },
//마우스 내리면
mouseleave: function () { J(this).removeClass("reverse"); }
});
});
</script>
<title>Untitled Page</title>
</head>
<body>
<h1>Header-0</h1>
<h1>Header-1</h1>
<h1>Header-2</h1>
</body>
</html>
※ 이벤트 메서드 중 한번만 실행시키는 one() 도 bind 와 사용법이 같다
'공부 > JQuery' 카테고리의 다른 글
| JQuery_[ one() 이벤트(이벤트를 한번만 연결) ] (1) | 2013.01.21 |
|---|---|
| JQery_[ hover() & toggle ] (0) | 2013.01.21 |
| JQuery_[특정 태그 선택(find)] (0) | 2013.01.07 |
| JQuery_[JQuery filter() 메서드 사용] (0) | 2013.01.07 |
| JQuery_[JQuery 를 이용한 객체 확장] (0) | 2013.01.07 |