Question

我构建了一个小脚本。

我想放入一些字段，并使用jquery的append函数进行操作。

现在每行后面都应该有一个切换开关。

它可以工作，但不能正常工作。

有人可以帮我进行右拨动，然后删除任何选定的行吗？

谢谢

var x = 1; //initlal text box count
var max_fields = 5
var add_fields = $(".add_field");
var inputrows = $(".input_rows");
    
$(add_fields).click(function(e){ //on add input button click
    e.preventDefault();
    if(x < max_fields){ //max 
  	x++; //text box increment
        $(inputrows).append('<div class="descriptionrow" id="' + x + '"><div class="remove"><input type="text" name="posten[]" class="in90 posten"><a href="#" class="add_description_field">EX</a><br /><div class="description" style="display:none;">Beschreibung ' + x + '</div></div></div>'); //add input box
	$('.add_description_field').click(function(e){
	    $(this).closest('.remove').find('.description').toggle();
	});
    }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<button class="add_field">weitere Position hinzufügen</button><br /><br />

<div class="input_rows"></div>

Answer 1

每次添加一个字段时，都会向 all .add_description_field链接添加一个点击处理程序，而不仅仅是您刚刚添加的新链接。因此，当您单击较旧的链接时，此处理程序将运行多次。第一次将以一种方式切换描述，第二次将以另一种方式切换描述，因此，如果处理程序的数量为偶数，它们将互相抵消。

与其在每次添加字段时都添加处理程序，不如Event binding on dynamically created elements?来一次委派处理程序。

input_rows.on("click", ".add_description_field", function(e){
    $(this).closest('.remove').find('.description').toggle();
});

为什么每秒切换在追加功能中不起作用？

1 个答案: