Javascript覆盖表单提交事件不起作用

Question

我正在覆盖这样的表单提交事件：

form.onsubmit = function(event) {
  event.preventDefault();

但是当我在一个单独的函数中像这样在表单上调用 submit 时：

form.submit();

不调用 onsubmit 函数，并且像往常一样发布表单。

有什么想法吗？

编辑：

我还在此表单中创建文件输入并立即调用其单击事件。这会影响表单提交事件吗？：

if (fileInput && document.createEvent)
{
    var evt = document.createEvent('MouseEvents');
    evt.initEvent('click', true, false);
    fileInput.dispatchEvent(evt);
}

编辑#2：

在文件输入值更改后，我通过调用表单的提交函数来提交表单：

function nameFileLabel(id)
{
    var f = document.getElementById('fileForm' + id);
    var l = document.getElementById("fileText_" + id);
    var i = document.getElementById("fInputId" + id);
    if (i.value != '')
    {
        l.innerHTML = i.value.replace('fakepath', '...');
        var theUploadForm = document.getElementById('fileDiv_' + id);
        theUploadForm.style.visibility = 'visible';
        theUploadForm.style.display = 'block';
        f.submit();
    }
}

Answer 1

为了防止表单发布，您的函数必须返回 false。

form.onsubmit = function(event) {
    event.preventDefault();
    return false;
}

Answer 2

正如 Manish 指出的那样，重写提交函数和在 JavaScript 中调用提交表单都会使事件的传播变得复杂。因此，在javascript中添加了一个隐藏按钮到表单中，并调用按钮的单击函数而不是表单提交函数。这似乎有效，尽管感觉像是一个拼凑！非常感谢大家的及时帮助。:-)

function nameFileLabel(id)
{
    var f = document.getElementById('fileForm' + id);
    var l = document.getElementById('fileText_' + id);
    var i = document.getElementById('fInputId' + id);
    var b = document.getElementById('sub' + id);
    if (i.value != '')
    {
        l.innerHTML = i.value.replace('fakepath', '...');
        var theUploadForm = document.getElementById('fileDiv_' + id);
        theUploadForm.style.visibility = 'visible';
        theUploadForm.style.display = 'block';
        b.click();
    }
}