클론 앤 Appendto - 작동시키지 못함 (JS Newb)

Question

와우. 둘 다 완벽하게 작동했습니다. 고맙습니다!!!

추가 질문이 하나 더 있습니다. 고유 한 수업을 통해 4 가지 TabContent Div가 있다고 가정 해보십시오. 그리고 모든 탭 콘텐츠 divs에 Getit 클래스를 추가하고 싶습니다 ...

방금 ​​appendTo에 'tabcontent'를 추가하면 모든 'tabcontent'div의 하단에 추가됩니다. 하지만 GetIt ID와 중복 된 동일한 콘텐츠가 있습니다. 누군가가 내 탭 내비게이션에서 GetIt을 선택한 경우 복제본이 나타나지 않지만 다른 모든 tabcontent 클래스에 나타나게하려면 어떻게해야합니까?

첫째, 제가 많은 자바 스크립트를 모르는 가정 해 봅시다 :

다음은 내 원래의 문제였다. 그냥 여기 뭔가 함께 조각하려고.

내 문제는 이것이다 :

내가 한 사업부의 ID를 가지고 그것을 복제하고 콘텐츠를 변경하지 않고 다른 사업부의 ID에 추가 할

.

HTML은 다음과 같습니다

나는/복사 'Getit'ID를 복제하고 '역사'ID의 말미에 추가 할

<div class="tabcontent" id="Getit"> Buy my widgets</div> 
<div class="tabcontent" id="History"> History of my widgets</div> 

.

현재, 내 자바 스크립트 코드는 다음과 같습니다

$('#tabcontent .Getit').clone().appendTo('#tabcontent .History'); 

난 당신이 제공 할 수있는 모든 도움을 주셔서 감사합니다.

감사합니다.

Answer 1

선택기 '#tabcontent .Getit'은 #tabcontent의 하위 인 모든 .Getit 요소를 검색합니다. 나는 그것이 당신이 원하는 것이라고 생각하지 않습니다.

이 그것을 수행해야합니다

$('#Getit').clone(true).appendTo('#History'); 

는 aswell 연결된 모든 데이터를 & 이벤트를 복제하는 원인이 true 매개 변수 .clone() 호출. 그러나 이는 선택 사항입니다.

Answer 2

.은 클래스 선택기이며 #은 ID 선택기입니다. #tabcontent은 고유 한 ID 요소를 찾고 있습니다. .Getit은 선택된 요소 id가 아니라 선택한 요소의 배열을 돌려 줄 것입니다.

시도 .tabcontent#Getit. 또한 #History도 마찬가지입니다. #Getit.tabcontent 및 #History.tabcontent을 수행하거나 역순으로 처리하려는 경우 (자손 선택자 인 공백이 없으므로) 둘 다 사용하여 요소를 선택할 수 있습니다.

<div class="tabcontent" id="Getit"> Buy my widgets</div> 
<div class="tabcontent" id="History"> History of my widgets</div> 

$('.tabcontent#Getit').clone().appendTo('.tabcontent#History'); 

http://jsfiddle.net/qreQ5/

주, 당신은 또한 어떻게 든 클론의 id 속성을 처리 할 것입니다.예를 들어

$('.tabcontent#Getit').clone().attr('id','test').appendTo('.tabcontent#History'); 

http://jsfiddle.net/qreQ5/2/