1

根据关于此的其他stackoverflow帖子，这应该有效。然而事实并非如此。这是代码。非常基本，仅用于测试。

HTML： 

    <form>
        <div id="inputs">
            <p><input type="text" id="user" /></p>

        </div>
        <hr />
        <input type="button" value="Add Another Row" class="add" id="add" >
    </form>

和jQuery：

<script>
  $(function() {
    var node = "";
    var count = 0;

    $('#add').on('click', function() {
    $node = '<p><input type="text" id="' + count + '"><a href="#" class="remove">Remove Number' + count + '</a></p>';
    count++;
    $('#inputs').append(node);
  });

  $('.remove').on('click', function() {
    $(this).parent().remove();
    return false;
    });
  });

 </script>

奇怪的是添加字段功能在我的浏览器上运行。然而，我将相同的代码放入 JSFiddle 中，但它在那里不起作用。在我的浏览器或 JSFiddle 中，删除功能根本不起作用。总的来说，我仍在学习 JQuery 和 Javascript，所以任何帮助我学习的帮助都将不胜感激。谢谢！

4

1 回答 1

3

您的代码的第一个问题是使用了错误的变量

你已经声明 var node = "";

但将其分配给$node = '<p><input

并将其附加到$('#inputs').append(node);

node总是空$node的..但包含HTML

其次，您需要委托事件 

$('.remove').on('click', function() {

应该是

$('#inputs').on('click', '.remove',  function() {

事件将仅绑定到附加事件时页面上存在的元素。

因此，委派活动应该可以解决问题。

检查小提琴

于 2013-06-17T23:36:43.280 回答