表单提交按钮无console.log输出问题求助(JavaScript新手)
问题排查与修复方案
1. JS代码根本没执行
你的HTML里把JS文件引入代码注释掉了,浏览器根本没加载你写的逻辑:
<!--<script src="script.js"></script>-->
直接去掉注释,让JS代码生效:
<script src="script.js"></script>
2. 事件绑定到了错误元素
你把submit事件绑在了id为Formulario的<div>上,但只有<form>标签才会触发submit事件,div不会响应这个事件。
修复方式:
给<form>标签加上id,把事件绑定到form上:
<form action="#" id="Formulario">
JS里的选择器不用改,保持原来的document.getElementById('Formulario')就行。
3. 没阻止表单默认提交行为
就算绑定对了form,点击提交按钮后浏览器会默认刷新页面,console.log的内容会瞬间消失,根本看不到。必须在回调里阻止默认行为:
if (cadForm){ cadForm.addEventListener("submit", async (e) => { e.preventDefault(); // 阻止页面刷新 console.log("Success"); // 这里可以调用弹窗函数 showErrorAlert(); }) }
额外提醒:别覆盖全局alert
你定义的function alert()会替换浏览器自带的alert方法,容易出问题,建议改名,比如:
function showErrorAlert(){ Swal.fire({ icon: 'error', title: 'Ops..', text: 'Pelo visto a placa do veiculo não está cadastrada.', footer: '<a href="">Gostaria de cadastrar?</a>' }) }
内容的提问来源于stack exchange,提问作者Rods_Programmer
相关产品推荐
相关产品推荐

