
当动态生成的表单中包含删除按钮时,若按钮未显式设置 `type="button"`,其默认类型为 `submit`,会导致在输入框内按 enter 键时意外触发表单提交或冒泡至父表单,进而激活删除逻辑。本文提供简洁可靠的解决方案。
问题根源在于:HTML 中
✅ 正确做法是显式声明按钮类型为 button,彻底消除其提交语义:
⚠️ 注意事项:
- 不要依赖 event.preventDefault() 或监听 keydown 拦截 Enter(治标不治本,增加复杂度且易遗漏);
- 避免将删除按钮嵌套在
- 若页面存在外层
- 动态生成按钮时(如通过 JS 拼接字符串或 document.createElement),务必同步设置 type="button":
// ✅ 动态创建示例
const btn = document.createElement('button');
btn.type = 'button'; // 关键!
btn.className = 'remove_node_btn_frm_field';
btn.textContent = '删除';
row.appendChild(btn);总结: 无需修改现有 JavaScript 事件绑定逻辑,仅需修正 HTML 按钮声明,即可一劳永逸避免输入过程中误删整行。
立即学习“Java免费学习笔记(深入)”;










