2011-02-19 4 views
0

페이지에서 다양한 수의 모달 텍스트 영역에 대해 기능적인 확인 및 취소 버튼을 만들려고합니다.JQuery 모달 텍스트 영역의 확인 및 취소 기능

html로는 다음과 같이 보일 것입니다 :

<a href="#00001_Modal" class="modal">note</a> 
     <div id="00001_Modal" class="window bgiframe"> 
      <h3>Notes for Print Speed:</h3> 
      <textarea name="00001_NoteText" id="00001_RealTextArea" class="rlTb"></textarea> 
      <textarea name="00001_TempNoteText" id="00001_TempTextArea" class="rte"></textarea> 
      <a href="#" class="close-modal cancelBtn">Cancel</a> 
      <a href="#" class="close-modal doneBtn">Done</a> 
     </div> 

나는 이미 내가 원하는 모달 기능을 가지고 있지만 채우기 어려운 증명한다. 내가 모달 닫기 전에 달성하기 위해 노력하고 동작은 다음과 같습니다

  • 앵커
  • 가 "완료"를 편집 (초) 텍스트 영역을 지 웁니다 "취소"앵커는 편집 가능한 텍스트 영역에서 항목을 소요하고 (실제에 넣는다 first) textarea

또한 편집 가능한 텍스트 영역은 모달을 열 때 실제 텍스트 영역의 내용으로 채워야합니다.

저는이 앵커 각각의 부모를 찾는이 JQuery 토끼 구멍을 내려 갔지만 부모의 텍스트 영역 어린이를 선택하는 데 문제가 있습니다.

이 : alert(($(this).parent()[0].id)>("textarea"):nth-child[1];

분명히 바보이고 아무것도하지 않고 나보다해야 난이 더 복잡하게 만들고있다처럼 느낄 수 있습니다.

이 작업을 수행하는 간단한 방법이 있어야합니다.

답변

0

closest() 기능으로 수행 할 수 있습니다. 다음은 예입니다

여기
$('.cancelBtn').click(function(){ 
    $(this).siblings('.rte').val(''); 
    return false; 
}); 

$('.doneBtn').click(function(){ 
    $(this).siblings('.rlTb').val($(this).siblings('.rte').val()); 
    return false; 
}); 

샘플 환상적인 jsfiddle.net

+0

에, 당신에게 뜨거운 감사합니다! – Maxabee

관련 문제