html表单onsubmit事件失效的排查与修复
在网页开发中，表单提交是常见操作，而onsubmit事件常用于表单数据校验。然而，onsubmit事件有时会失效，导致表单直接提交，本文将分析并解决onsubmit="return check();"失效的问题。
问题：
用户反馈，表单使用onsubmit="return check();"调用JavaScript校验函数check()，但表单直接提交到postreg.php，check()函数未执行。HTML代码如下：
function check(){ let username = document.getElementsByName('usermane')[0].value.trim(); //此处存在拼写错误 let usermail = document.getElementsByName('usermail')[0].value.trim(); let password = document.getElementsByName('password')[0].value.trim(); let usernamereg = /^[a-zA-Z0-9]{3,10}$/; if(!usernamereg.test(username)) { alert('用户名必填.且只能大小写字母和数字构成.长度为3到10个字符.'); return false; }}[返回登录](login.html)[忘记密码](wjmm.html)
分析与解决：
问题在于JavaScript校验函数check()中的拼写错误。document.getElementsByName('usermane')应为document.getElementsByName('username')。
修正后的代码：
function check(){ let username = document.getElementsByName("username")[0].value.trim(); let usernamereg = /^[a-zA-Z0-9]{3,10}$/; if(!usernamereg.test(username)) { alert('用户名必填.且只能大小写字母和数字构成.长度为3到10个字符.'); return false; } // ... 其他校验逻辑 ... return true; // 添加return true 用于表单验证通过的情况}[返回登录](login.html)[忘记密码](wjmm.html)
更正拼写错误后，onsubmit事件应能正常工作。如果问题仍然存在，建议检查浏览器缓存，或尝试不同的浏览器，并确保标签中包含onsubmit属性。 此外，完整的校验函数应该在所有条件都满足时返回true，以允许表单提交。
以上就是表单onsubmit事件失效，如何排查并解决？的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1562316.html
微信扫一扫 
支付宝扫一扫 
