我想在点击“更多”后添加新的输入框和“删除”链接。也可以通过单击“删除”删除输入框。
但是,单击删除链接后,输入框不会被删除。
有没有人可以帮助他们?非常感谢!
<script type="text/javascript">
$(document).ready(function(){
$('#link').click(function(){
$('#newField').append('<input type="textbox"><a href="#" id="removeField">Remove</a><br/>');
});
$('#removeField').click(function(){
$("#newField").remove();
});
});
</script>
<a href="#" id="link" title="Add field by clicking">More</a>
<div id="newField">
</div>
答案 0 :(得分:1)
当您尝试绑定click事件时,DOM上的元素'removeField'不可用。尝试使用'on'http://api.jquery.com/on/或http://api.jquery.com/live/
绑定事件答案 1 :(得分:0)
我认为这将完成你想要做的事情:
<a href="#" id="link" title="Add field by clicking">More</a>
<div id="newField"></div>
<script type="text/javascript">
$('#link').on('click',function() {
$('#newField').append('<input type="textbox"><a href="#" class="removeField">Remove</a><br/>');
});
$('#newField').on('click','.removeField',function() {
$this = $(this);
$this.prev().remove();
$this.next().remove();
$this.remove();
});
</script>
你应该在jQuery中使用.on()
- 函数。
答案 2 :(得分:0)
添加字段时,不会为其添加ID,因此无法将其删除。试试这个:
$('#newField').append('<input type="textbox" id="monNewField"><a href="#" id="removeField">Remove</a><br/>');
但如果我是你,我会做这样的事情,所以你可以添加和删除任意数量的字段:
$('#newField').append('<div class="row"><input type="textbox"><a href="#" class="removeField">Remove</a></div>');
然后:
$('.removeField').click(function(){
$(this).parent().remove();
});