HTML点击a标签包裹的submit按钮跳转错误页面问题求助

跳转异常的原因 #

• 你的按钮设置了type="submit"属性，这是表单提交按钮，点击后会优先触发外层<form>标签的提交行为，你表单上配置的action="registered.html"就会生效，直接跳转到这个地址，优先级远高于你外层包裹的<a>标签的跳转逻辑，所以你预期的Register.html跳转根本不会执行。
• 你是直接通过本地文件协议（file://）打开的页面，浏览器出于安全限制，默认禁止加载本地路径下的表单提交目标资源，因此控制台抛出了Not allowed to load local resource的报错，地址末尾的问号是因为表单用get方法提交，没有表单参数所以只拼接了一个空的参数前缀。

修复方案 #

你可以根据自己的需求选择对应方案：

方案1：移除不需要的form标签 #

如果你的页面没有表单数据需要提交，只是做纯跳转功能，直接删掉外层的<form>标签即可，同时为了符合HTML规范，不推荐嵌套<a>和<button>两个交互式元素，建议调整为如下写法：

<button type="button" class="registerAsButton1" onclick="location.href='Register.html'">Customer</button>
<button type="button" class="registerAsButton2" onclick="location.href='Register.html'">Vendor</button>
<a href="index3.html" class="link1">ALREADY HAVE AN ACCOUNT? SIGN IN</a>

方案2：保留form标签，禁用按钮的提交行为 #

如果你需要保留外层form标签，只需要把两个按钮的type="submit"修改为type="button"，即可阻止默认的表单提交行为，点击后会触发<a>标签的跳转。

额外注意事项 #

注意文件名大小写匹配，你代码里写的跳转地址是Register.html，如果实际文件名为全小写的register.html，在macOS、Linux等大小写敏感的系统下会触发404错误，建议统一文件名的大小写格式。
另外本地调试时建议使用本地静态服务（比如VS Code的Live Server插件）打开页面，不要直接用file协议打开，可以避免本地资源加载限制的报错。

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