2010-12-15 4 views
1

양식 섹션을 복제해야하는 퀴즈 작성 양식을 작성 중입니다.jQuery 복제본 질문 (복제 양식 입력 세트)

see jsFiddle code example here

내 문제는 질문 필드의 새로운 세트의 추가와 함께. "다른 질문 추가"버튼을 클릭하면 첫 번째 답변에 둘 이상의 응답 필드가있는 경우 하나 이상의 응답 필드가 복제되고 복제 된 "다른 질문 추가"버튼이 작동하지 않습니다.

이 문제에 대한 도움을 주시면 감사하겠습니다.

감사합니다.

+0

내가 왜 투표에 실패했는지 모르겠다. 이것은 매우 유효한 질문이다. 공정성을 회복하기 위해 투표했다. :) – Andrey

+0

감사합니다 Andrey. 1 분 안에 투표가 종료됩니다! 그것은 첫 번째입니다. – superUntitled

답변

1

나는 몇 가지를 추천합니다. 이미 가지고있는 빈 것을 복제하십시오.

질문에 live도 설정했으나 실제로 사용할 답변은 '답변 추가'버튼입니다. Live는 DOM에 추가 된 모든 항목에 대한 핸들러를 설정합니다. 첫 번째 테스트가 작동하지 않는 경우를 제외하고는 '답변 추가'버튼을 클릭하는 이유입니다.

var emptyQ = $("li.question").clone(), 
    emptyA = $("li.answer").clone(); 


$("#addQuestion").live('click', function(e) { 
    e.preventDefault(); 
    $('#questioncontainer').append(emptyQ.clone()); 

}); 

$(".addAnswer").live('click', function(e) { 
    e.preventDefault(); 
    $(this).parent().find(".answerContainer").append(emptyA.clone()); 
}); 

근무 예 : http://jsfiddle.net/jonathon/Sd9Ag/

내가 클릭 된 버튼의 질문/응답 용기를 얻을 수 $(this).parent()를 사용합니다. 즉, 동일한 처리기가 모두에게 적용됩니다.

마침내 - 차이가 있는지 모르겠지만 클릭 핸들러에서 return false 대신 e.preventDefault()을 사용합니다. 나는 잘 모르겠다 - 나는 그것이 더 우아하다고 생각한다.

+0

깊이 대답 해 주셔서 감사합니다. 이것은 완벽하게 작동합니다! – superUntitled

4

처리기를 복제하려면 .clone(true)이 필요합니다.

그리고 아마도 add another answer 처리기에 대해 이렇게 할 수 있습니다.

$('.answer:last').clone().appendTo($(this).prev().find('.answerContainer')).find("input").val("");  

그렇지 않으면 모든 답변 컨테이너에 추가됩니다. - 당신은 자신이 이미 값으로 뭔가를 복제하는 데 그들을 취소 할 필요가 저장 그런 식으로 비어 때 당신은 HTML의 사본을 만들 수 있습니다

: