防止表单在页面加载时自动重新提交

时间:2010-04-28 17:36:33

标签: javascript jquery html forms

我正在使用jQuery将表单的目标指向.submit()上的iframe。这是上传文件。它工作正常,但当页面重新加载,并且iframe附加到DOM时,iframe会自动重新提交表单,导致在每次页面加载时将相同的文件发送到服务器。

如果我没有在HTML标记中包含iframe,或者不将其附加到DOM,则不会发生这种情况,但当然,我需要iFrame。

所以我的问题是,我该如何防止这种情况?

:)

安德鲁

2 个答案:

答案 0 :(得分:0)

将iframe附加到文档就绪的文档正文中。

$(function(){
    $("body").append("<iframe id='whatever' src='javascript:void(0)' />");
});

答案 1 :(得分:0)

因此,事实证明,如果用户重新加载页面时iframe存在于DOM中,它将再次触发表单,因此我只是在用户单击发送文件之前不添加iframe。

完整的代码(有些只与我的项目有关,但想法就在那里:

function uploadHandler()
{
    if ($.browser.safari || $.browser.opera || $.browser.msie)
    {
        setTimeout(uploadComplete, 5);
    }
    else
    {
        uploadComplete(this);
    }
}


function uploadFile(e)
{

    if($('.uploadFrame').length > 0)
    {
        uploadiFrameNode.remove();
    }
    n = 'f' + Math.floor(Math.random() * 99999);
    uploadiFrameNode = $('<iframe class="uploadFrame invfr" src="about:blank" id="'+n+'" name="'+n+'"></iframe>');
    uploadiFrameNode.load(uploadHandler);
    $('body').append(uploadiFrameNode);
    formNode.attr('action', _ajaxPath  + "?drive=" + drive);
    formNode.attr('target', n);
    formNode.attr('method', 'POST');
    formNode.attr('enctype', 'multipart/form-data');
    formPathNode.val(tree[tree.length - 1].path);
}
function uploadComplete()
{
    refresh(tree[tree.length - 1].path);
    backToMenu();
    fileReset();
}