Javascript jQuery默认不处理表单I'；我们添加了另一个ajax调用

我执行一个ajax调用，该调用存储一些数据并在表中添加一行。 在这一行的末尾有一个删除按钮，因此如果需要，您可以立即删除您创建的行

出于某种原因，当我单击delete按钮时，我被重定向到用于从数据库中删除数据的ajax调用的deleteurl。当我重新加载页面并按下删除按钮时，它工作正常

有人知道为什么会这样吗

正在添加的行：

<tr>
    <td>test</td>
    <td>
        <form class="deleteBuildingForm" method="POST" action="http://127.0.0.1:8000/buildingimage/42" accept-charset="UTF-8">
            <input name="_method" type="hidden" value="DELETE">
            <input name="_token" type="hidden" value="EEV90wmDNLMd8hg9ilh6zdDAjVShXW9bfOCXdvml">
            <button type="submit" class="btn btn-danger">
                <i class="far fa-trash-alt"></i>
            </button>
        </form>
    </td>
</tr>

---

我认为问题在于新行没有绑定事件处理程序，因为它们是动态创建的

尝试将事件处理程序添加到文档中，该文档将始终存在

$(document).on('submit','.deleteBuildingForm' ,function(e) {
    e.preventDefault();

    axios.delete($(this).attr('action'), []).then(response => {
        $(this).closest('tr').remove();

        $('.successMessages').hide();
    });
});

---

可能

返回false会有帮助吗？@Kuba你什么意思？而不是
e.preventDefault（）在提交回调的末尾添加
返回false@Kuba我试过了，同样的问题你在动态添加按钮。您需要在（'submit'，'deleteBuildingForm'，函数上编写类似$（'body'）的内容（…事件是在页面加载时创建的，如果您在之后添加该项，事件将不会触发，因为它不知道引用的元素。通过刷新，它会找到该元素并正常工作。通过将代码更改为我编写的代码，它会检查正文上的事件，而不是不存在的元素。答案几乎相同，相隔12秒。我认为你的选票是值得的：——）
$(document).on('submit','.deleteBuildingForm' ,function(e) {
    e.preventDefault();

    axios.delete($(this).attr('action'), []).then(response => {
        $(this).closest('tr').remove();

        $('.successMessages').hide();
    });
});