$(this).parent()。remove()导致页面刷新

时间:2011-11-17 20:36:46

标签: javascript jquery html

我有一个页面,只需点击一个按钮,即可插入表单。可以添加无数种形式。每个表单还有一个按钮,可以单击该按钮删除表单。

    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的末尾。

知道为什么会这样吗?提前感谢您的帮助!

2 个答案:

答案 0 :(得分:6)

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

答案 1 :(得分:1)

如果您愿意,可以从此处复制和替换代码。

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