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事件失效,如何排查并解决?的详细内容,更多请关注【创想鸟】其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。
发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2793530.html