[jquery] 이벤트 연결 제거 -unbind()
개발 Programming/JQUERY2018. 9. 3. 13:43
unbind() 이벤트 제거
$(selector).unbind() - 해당 문서 객체의 모든 이벤트 제거
$(selector).unbind(eventName) -해당 문서 객체의 특정 이벤트와 관련된 모든 이벤트 제거
$(selector).unbind(eventName, function) - 특정 이벤트 핸들러 제거
-1번 사용 한번 글릭하면 팝업 띄우고 문서객체 내용이 Click으로 바뀜
-동일 기능으로 one() 메서드가 있음
이벤트 한번만 사용 가능 -one() 이벤트 한버만 연결
<html>
<head>
<style>
.reverse{
background: Red;
color:Yellow;
}
</style>
<script src='https://code.jquery.com/jquery-3.3.1.js'></script>
<script>
$(document).ready(function(){
$('h3').click(function(){
//1번 사용 한번만 실행
$(this).html('Click');
alert('이벤트 발생');
$(this).unbind();
})
});
</script>
</head>
<body>
<h3>header-0</h3>
<h3>header-1</h3>
<h3>header-2</h3>
</body>
</html>
- one() 사용
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("p").one("click", function(){
$(this).animate({fontSize: "+=6px"});
});
});
</script>
</head>
<body>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<p>Click any p element to increase its text size.</p>
</body>
</html>
'개발 Programming > JQUERY' 카테고리의 다른 글
| [jquery] jquery 이벤트 객체 (0) | 2018.09.03 |
|---|---|
| [jquery] 매개변수 Context를 활용하여 selector 작동 범위 지정-$(selector, context) (0) | 2018.09.03 |
| [jquery] 이벤트 연결 -간단방식 -hover(mouseenter,mouseleave) (0) | 2018.09.03 |
| [jquery] 이벤트 -bind() (0) | 2018.08.31 |
| [jquery] 문서 객체 간단 생성,삽입,이동,복사 복제-$(), append().appendTo() (0) | 2018.08.30 |
댓글()