>  기사  >  웹 프론트엔드  >  jQuery.clone() 함수 예제에 대한 자세한 설명

jQuery.clone() 함수 예제에 대한 자세한 설명

巴扎黑
巴扎黑원래의
2018-05-19 16:16:181952검색

clone() 함수는 현재 일치하는 요소 집합의 복사본을 복제하고 이를 jQuery 개체 형식으로 반환하는 데 사용됩니다. 현재 jQuery 객체를 복제한다고 간단히 이해할 수도 있습니다.

또한 일치하는 요소(하위 요소도 포함)의 추가 데이터(data() 함수)를 복사하고 이벤트를 바인딩할지 여부를 지정할 수 있습니다.

이 함수는 jQuery 객체(인스턴스)에 속합니다.

Syntax

jQueryObject.clone( withDataAndEvents [, deepWithDataAndEvents ] )

Parameters

매개변수 설명

withDataAndEvents 선택/부울 유형 요소의 추가 데이터와 바인딩 이벤트를 동시에 복사할지 여부, 기본값은 거짓.

deepWithDataAndEvents Optional/Boolean 유형 요소의 모든 하위 요소에 대한 추가 데이터 및 바인딩 이벤트를 동시에 복사할지 여부, 기본값은 withDataAndEvents 매개 변수의 값입니다.

clone()은 주로 현재 jQuery 객체의 복사본을 복제하는 데 사용됩니다.

jQuery 1.5의 새로운 지원: clone()은 두 번째 매개변수 deepWithDataAndEvents를 지원합니다. 복제된 요소의 모든 하위 요소에 대한 추가 데이터 및 바인딩 이벤트를 동시에 복사할지 여부를 나타내는 매개변수입니다.

참고:

1. jQuery 1.4 이전에는 clone() 함수가 요소의 바인딩 이벤트만 추가로 복사했습니다. 버전 1.4부터 요소의 추가 데이터 복사를 지원하기 시작했습니다.

2. 버전 1.5.0(1.5.0만 해당)에서는 withDataAndEvents 매개변수의 기본값이 true로 잘못 설정되었습니다. 1.5.1부터 기본값이 다시 false로 변경되었습니다.

반환 값

clone()함수의 반환 값은 jQuery 유형이며 현재 jQuery 개체의 복제 복사본을 반환합니다.

참고: 성능상의 이유로 clone() 함수는 사용자가 4750256ae76b6b9d804861d8f69e79d3에 입력한 콘텐츠 및 221f08282418e2996498697df914ce4e에서 사용자가 선택한 옵션과 같은 일부 양식 요소의 동적 특성을 복사하지 않습니다. 그러나 사용자가 텍스트에 입력한 내용과 사용자가 선택한 state 체크박스와 같은 d5fd7aea971a85678ba271703566ebfd 요소의 역학은 복사됩니다.

예제 및 설명

clone() 함수는 현재 jQuery 개체를 복제하는 데 사용됩니다. 다음 HTML 코드를 예시로 참조하세요.

<p id="n1">
    <input id="n2" type="button" value="按钮1" />
    <input id="n3" type="button" value="按钮2" />
</p>

다음 jQuery 샘플 코드는 clone() 함수의 구체적인 사용법을 보여주기 위해 사용됩니다:

// 현재 jQuery 버전: 1.11.1

$(": 버튼").click ( function(){

document.writeln( this.value );

} );

var $n2 = $("#n2");

$n2.data(" myData", "데이터 추가");

//추가 데이터 복제 및 바인딩 이벤트가 없습니다

var $clonedN2 = $n2.clone(); // 두 매개변수 모두 기본값은 false

document.writeln( $ clonedN2.data(" myData") ); // undefine

$clonedN2.trigger("click"); // (바운드 클릭 이벤트 없음, 응답 출력 없음)

//추가 데이터와 바운드 이벤트를 동시에 복제합니다. time

var $ clonedN2WithCopy = $n2.clone( true ); // 두 개의 매개변수: true, true (두 번째 매개변수는 설정되지 않으며 기본값은 첫 번째 매개변수의 값)

document.writeln( $clonedN2WithCopy. data("myData" ) ); // 추가 데이터

$clonedN2WithCopy.trigger("click"); // 버튼 1

위 내용은 jQuery.clone() 함수 예제에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.