2011-08-03 3 views
0

일부 코드는 함께 사용하고 Firebug에서는 오류를 발생시키지 않습니다.jQuery 구문/논리 쿼리

HTML을 함께
jQuery(document).ready(function($) { 

    var i = jQuery('[name="reference[]"]').size() + 1; 

    jQuery('a#add_reference').click(function() { 
     input_code = '<div class="reference">' + 
      '<input type="hidden" value="" name="reference[]" />' + 
      '<h3>Reference #' + i + '</h3>' + 
      '<div class="line double">' + 
       '<label>Author(s)</label> <input type="text" name="ref_authors" />' + 
       '<label>Publisher</label> <input type="text" name="ref_publisher" />' + 
      '</div>' + 
      '<div class="line double">' + 
       '<label>Publication Year</label> <input type="text" name="ref_pub_year" />' + 
       '<label>Page Number(s)</label> <input type="text" name="ref_page_nums" />' + 
      '</div>' + 
      '<div class="line"><label>Document Title</label> <input type="text" name="ref_doc_title" /></div>' + 
      '<div style="clear:both;">&nbsp;</div>' + 
      '<p>Click <a href="javascript:void(0);" id="' + i + '_del_reference">here</a> to remove Reference #' + i + '.</p>' + 
     '</div>'; 

     jQuery(input_code).appendTo('#references_wrapper'); 

     i++; 
    }); 

    jQuery('[id="' + i + '_del_reference"]').click(removeBox); 
    jQuery('[id="1_del_reference"]').click(removeBox); 

    var removeBox = function() { 
     jQuery(this).parents('div.reference').remove(); 
     return false; 
    }; 


}); 

:

<div id="references_wrapper"> 
     <p>Click <a href="javascript:void(0);" id="add_reference">here</a> to add a new reference.</p> 
     <div class="reference"> 
      <input type="hidden" value="" name="reference[]" /> 
      <h3>Reference #1</h3> 
      <div class="line double"> 
       <label>Author(s)</label> <input type="text" name="ref_authors" /> 
       <label>Publisher</label> <input type="text" name="ref_publisher" /> 
      </div> 
      <div class="line double"> 
       <label>Publication Year</label> <input type="text" name="ref_pub_year" /> 
       <label>Page Number(s)</label> <input type="text" name="ref_page_nums" /> 
      </div> 
      <div class="line"><label>Document Title</label> <input type="text" name="ref_doc_title" /></div> 
      <div style="clear:both;">&nbsp;</div> 
      <p>Click <a href="javascript:void(0);" id="1_del_reference">here</a> to remove Reference #1.</p> 
     </div> 
    </div> 

인한 문제 내가 참조를 추가 할 수 있지만 삭제할 수 없다는 것입니다.

누군가 내가 잘못한 점을 지적 해주세요. 실망 스럽다 나는 약간의 시간 (약간 다른 효과와 함께)의이 종류를했다. 그리고 나는 아직도 그것이 일하게 할 수 없다!

미리 감사드립니다.

+6

무엇이 문제입니까? 예상되는 동작을 언급하지 않았고 코드가 실제로 수행하는 동작과 어떻게 다른지 설명하지 않았습니다. –

+0

heh, 여기가 어디가 잘못되었는지 - 당신이 우리에게 당신의 문제를 말하지 않았을 때 :) – Milimetric

+0

btw, 기본적으로 클라이언트 측 템플리트를 수행하려는 코드의 경우 jQuery tmpl을 살펴보십시오. http : // api .jquery.com/jquery.tmpl/ – Milimetric

답변

0

작은 논리 오류; 당신은 이벤트 처리기를 할당하지 않고 (그래서 당신이 참조를 제거 couldnt) 올바르게 변수를 증가했다. .live()로 변경하여 새 객체에 이벤트 핸들러를 제공합니다.

업데이트 됨 : http://jsfiddle.net/UZkjE/

+0

환상적입니다, 감사합니다 :) – dunc