我已经把一些代码放在一起,部分工作并且在Firebug中没有抛出错误。
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;"> </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;
};
});
伴随HTML:
<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;"> </div>
<p>Click <a href="javascript:void(0);" id="1_del_reference">here</a> to remove Reference #1.</p>
</div>
</div>
问题是我可以添加引用,但不能删除它们。
谁能指出我哪里做错了吗?令人沮丧的是,我已经做了几次这种事情(效果略有不同),我仍然不能让它工作!小逻辑错误;您在没有分配事件处理程序的情况下递增变量I(因此您无法正确地删除引用)。将其更改为.live()以适应带有事件处理程序的新对象。
更新小提琴:http://jsfiddle.net/UZkjE/