Question

我使用AJAX将包含表单的外部HTML文件加载到另一个HTML文件中。表单HTML看起来像这样：

<form id="..." name="..." onsubmit="postUsingAJAX(x,y,x); return false;">

装载工作正常。但是，提交表单时不执行onSubmit代码，与提交按钮上的onClick处理程序相同;似乎没有触发事件监听器。这是通过AJAX加载HTML时我的工作方式还是我做错了什么？

可能的解决办法是

theFormObject.addEventListener('submit', function...)

但我无法弄清楚如何在回调被触发后使表单不提交。如何使其等待返回值（或者更确切地说，无论回调函数中发生什么，都将其“返回false”）？

有什么想法吗？

Answer 1

在postUsingAJAX函数中看起来像是一个错误。代码“return false”将不会执行。要在错误后继续正常工作，您应该使用try..catch语句。例如：

function postUsingAJAX() {
    try {
        // dangerous code
    } catch (e) {
        // report about error
    }
}

<form onsubmit="postUsingAJAX(); return false;">

Answer 2

如果您正在使用AJAX，我猜您不希望表单将用户带到新页面 - 您希望它调用处理页面并相应地更新当前页面。你应该做的是创建没有任何<form>标签的整个表单。然后，使用<button>标记（例如：<button id="whatever">Whatever</button>）将单击事件侦听器附加到该按钮以执行AJAX操作。这就是我总是使用用户填写的表单进行AJAX调用的方式。

在使用AJAX加载的表单上未触发onSubmit

2 个答案: