我正在尝试在 github 上为我的俱乐部建立一个测试网站。我正在使用表单,并且尝试在 html 文件中创建一个虚拟登录表单,但每次我按下提交按钮时,它不会将我定向到 html 文件。我能做些什么?如果可能的话,我更喜欢不使用 javascript 来完成此操作
<form action="/studentinterface.html" method="post">
<h1>Student Login</h1>
<fieldset>
<label for="email">Email</label>
<input type="email" id="email" name="user_email" placeholder="[email protected]" value="" required>
<label for="password">Password</label>
<input type="password" id="password" name="user_password" placeholder="your password" value="" required>
</fieldset>
<button class="cpoint" type="submit">Submit</button>
</form>
我希望它打开我的interface.html 文件,但它无法检索它。如果我在地址栏中输入实际的 html,它对我有用。
您面临的问题可能是由于您的网站在 GitHub 上的托管方式所致。处理表单提交时,GitHub Pages 的行为与传统 Web 服务器不同。以下是不使用 JavaScript 修复此问题的方法:
1。杠杆形式方法(首选):
将表单的方法属性更改为 GET。这会将表单数据附加到 URL 的问号 (?) 后面。 HTML
<form action="/studentinterface.html?message=success" method="get"></form>
说明:
通过使用 GET,浏览器会将表单数据作为键值对包含在 URL 中(例如,[email protected]&user_password=yourpassword)。这允许您的 Studentinterface.html 潜在地访问此数据(尽管出于安全原因受到限制)。
2。手动重定向(替代):
如果使用 GET 不理想,您可以在当前的 HTML 文件中实现重定向。但是,这种方法不会将数据发送到下一页。 HTML
<form action="" method="post">
<button class="cpoint" type="submit">Submit</button>
</form>
<script> // A small script snippet
function redirectOnSubmit(event) {
event.preventDefault(); // Prevent default form submission
window.location.href = "/studentinterface.html"; // Redirect to desired page
}
document.querySelector("form").addEventListener("submit", redirectOnSubmit);
</script>
说明:
此方法使用一个小的 JavaScript 片段来拦截表单提交。它阻止默认行为,然后使用 window.location.href 将用户重定向到 Studentinterface.html。