JavaScript调用.submit()提交表单报错submit is not a function问题咨询

报错根因 #

报错的核心原因是页面存在重复IDBillsReceive，违反了DOM ID全局唯一的规范：

• 你定义的模态窗口外层div的ID为BillsReceive
• 引入的应收账款登记表单的ID同样设置为BillsReceive

调用document.getElementById("BillsReceive")时，浏览器会优先返回DOM树中先渲染的模态框div元素，div本身没有内置submit()方法，因此抛出类型错误。

解决方法 #

任选一种方案修改即可：

• 方案1：修改模态窗口的ID，避免和表单ID冲突

<!-- 原模态框代码 -->
<div class="modal fade" id="BillsReceive" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<!-- 修改后（示例） -->
<div class="modal fade" id="BillsReceiveModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">

• 方案2：修改表单的ID，同时调整JS提交逻辑的取值ID

// 修改后的提交函数
function fncSendForm() {
    document.getElementById("BillsReceiveForm").submit();
}

内容的提问来源于stack exchange，提问作者Gabriel Augusto