.delegate (selector, eventType, handler)
.delegate (selector, eventType, handler)
설명 : 특정 루트 요소 집합을 기반으로 현재 또는 미래의 선택자와 일치하는 모든 요소에 대해 하나 이상의 이벤트에 핸들러를 연결합니다.
jQuery 3.0부터는 .delegate()더 이상 사용되지 않습니다. .on()jQuery 1.7 이후이 메서드 로 대체되었으므로이 메서드는 이미 사용되지 않았습니다. 그러나 이전 버전의 경우 이벤트 위임을 사용하는 가장 효과적인 방법으로 남아 있습니다. 이벤트 바인딩 및 위임에 대한 자세한 정보가이 .on()메소드에 있습니다. 일반적으로 다음 두 메소드의 동일한 템플리트입니다.
// jQuery 1.4.3+
$( elements ).delegate( selector, events, data, handler );
// jQuery 1.7+
$( elements ).on( events, selector, data, handler );
예를 들어 다음 .delegate()코드가 있습니다.
$( "table" ).delegate( "td", "click", function() {
$( this ).toggleClass( "chosen" );
});
다음을 사용하여 작성된 다음 코드와 동일합니다 .on().
$( "table" ).on( "click", "td", function() {
$( this ).toggleClass( "chosen" );
});
첨부 된 이벤트를 제거하려면 .undelegate () 메소드를 delegate()참조하십시오 .
이벤트 데이터를 전달하고 처리하는 것과 같은 방법으로 작동합니다 .on().
추가 참고 사항 :
이 .live()메서드는 이벤트가 문서 상단으로 전파되면 이벤트를 처리 하므로 라이브 이벤트 전파를 중지 할 수 없습니다. 비슷하게 처리 된 이벤트 .delegate()는 위임 된 요소로 전달됩니다. DOM 트리에서 그 아래에있는 모든 요소에 바인딩 된 이벤트 핸들러는 위임 된 이벤트 핸들러가 호출 될 때까지 이미 실행되었을 것입니다. 따라서 이러한 처리기는 위임 된 처리기가 호출 event.stopPropagation()하거나 반환 하여 트리거하지 못하게 할 수 있습니다 false.
예 :
단락을 클릭하여 다른 단락을 추가하십시오. .delegate ()는 클릭 이벤트 처리기를 모든 단락에 첨부합니다 (심지어 새로운 단락도 포함).
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>delegate demo</title>
<style>
p {
background: yellow;
font-weight: bold;
cursor: pointer;
padding: 5px;
}
p.over {
background: #ccc;
}
span {
color: red;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<p>Click me!</p>
<span></span>
<script>
$( "body" ).delegate( "p", "click", function() {
$( this ).after( "<p>Another paragraph!</p>" );
});
</script>
</body>
</html>
게시글 목록
| 번호 | 제목 |
|---|---|
| 15935 |
jQuery
jQuery ( ": first-child")
1
|
| 15934 |
jQuery
.first()
|
| 15933 |
jQuery
.finish ([queue])
|
| 15932 |
jQuery
.find (selector)
|
| 15931 |
jQuery
.filter (selector)
|
| 15930 |
jQuery
jQuery ( ": file")
|
| 15929 | |
| 15928 | |
| 15924 | |
| 15923 | |
| 15922 |
jQuery
event.which
|
| 15921 |
jQuery
event.type
|
| 15920 |
jQuery
event.timeStamp
|
| 15919 |
jQuery
event.target
|
| 15917 |
jQuery
event.stopPropagation ()
|
| 15916 | |
| 15915 |
jQuery
event.result
|
| 15914 |
jQuery
event.relatedTarget
|
| 15913 | |
| 15912 |
jQuery
event.result
|
| 15911 |
jQuery
event.relatedTarget
|
| 15910 |
jQuery
event.preventDefault ()
|
| 15909 |
jQuery
event.pageY
|
| 15908 |
jQuery
event.pageX
|
| 15907 |
jQuery
event.namespace
|
| 15906 |
jQuery
event.metaKey
|
| 15901 | |
| 15900 |
기타
vi 명령모드
|
| 15899 |
기타
vi 입력모드
|
| 15898 |
기타
vi의 세가지 모드
|
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기