$（this）.parent（）。remove（）会导致页面刷新

Question

我有一个页面，点击一个按钮后，插入一个表单。可以添加无限数量的表单。每个表单也有一个按钮，可以点击删除表单。

var form = " Name:<input id=\"room\" type=\"text\" /><br />\ 
       Age:<input id=\"floor\" type=\"text\" /><br />\ 
       <button class=\"removeParentForm\">Delete Form</button>"; 

    var formid = 0; 

    $("#addForm").click(function() { 
     formid = 1 + formid; 
     $('#forms').append("<form id= \"formID" + formid + "\" class=\"pr\"><br /></form>"); 
     $('#formID'+formid).append(form); 
     handleForm(); 
    }); 

    function handleForm(){ 
     $('.removeParentForm').click(function() { 
      $(this).parent().remove(); 
     }); 
    } 

上面的代码导致窗体被删除，但随后触发页面刷新并附加'？'到URL的末尾。

任何想法，为什么这可能发生？预先感谢您的帮助！

Answer 1

您需要点击处理程序中的return false以防止提交表单。

Answer 2

如果您愿意，您可以从这里复制并替换代码。

function handleForm(){ 
    $('.removeParentForm').click(function() { 
     $(this).parent().remove(); 
     return false; 
    }); 
}