html 表单提交时默认会触发表单提交行为，导致页面整页重载；若未显式阻止该默认行为，即使仅调用 javascript 函数（如 checkanswer()），页面仍会刷新。
html 表单提交时默认会触发表单提交行为，导致页面整页重载；若未显式阻止该默认行为，即使仅调用 javascript 函数（如 checkanswer()），页面仍会刷新。
在开发交互式网页（如你正在制作的三角函数练习小游戏）时，页面无故刷新是一个高频但易被忽视的问题。根本原因在于：HTML <form> 元素在用户触发提交（例如按回车键或点击提交按钮）时，会自动执行标准表单提交流程——向当前 URL 发送 GET 请求（或 POST，取决于 method 属性），从而强制浏览器重新加载页面。
你的代码中虽未显式写出 <form> 的 action 或 method，但只要存在 <form> 标签且内部包含可提交控件（如 <input type="text">），浏览器就将其视为可提交表单。而你在 checkAnswer() 中并未绑定到任何防刷新机制，因此每次用户输入后按 Enter 键，表单即提交 → 页面刷新 → 所有 JS 状态（如 currentStreak、startTime、currentAnswer）全部重置。
✅ 正确解法是 阻止表单的默认提交行为，仅执行自定义逻辑：
<form onsubmit="event.preventDefault(); checkAnswer();">
<input
type="text"
id="answer"
placeholder="Your answer"
autocomplete="off"
autofocus
/>
</form>? 补充说明：event.preventDefault() 必须在事件处理函数中调用，且需确保 event 对象可用。使用内联 onsubmit 时，浏览器自动注入 event 参数；更推荐的现代写法是分离 HTML 与 JS：
立即学习“前端免费学习笔记（深入）”；
// 在 script 标签或外部 JS 文件中
document.querySelector('form').addEventListener('submit', function (e) {
e.preventDefault(); // 关键：阻止默认提交
checkAnswer();
});⚠️ 注意事项：
- 不要遗漏 event.preventDefault() —— 即使 checkAnswer() 逻辑正确，缺少它仍会导致刷新；
- 避免在 checkAnswer() 内部调用 location.reload() 或隐式触发表单提交（如误将 <button> 写成 <button type="submit">）；
- 若使用 <button> 提交，请明确设置 type="button"（而非默认的 "submit"），否则也会触发表单提交；
- 调试技巧：在 checkAnswer() 开头添加 console.log('checkAnswer called');，若页面刷新前未见该日志，即可确认是表单默认行为导致，而非 JS 报错。
通过这一改动，你的三角函数练习游戏将稳定运行，计时、连击、分数等状态得以持续维护，用户体验显著提升。记住：所有基于表单交互的前端应用，都应主动控制提交行为——这是 Web 开发的基石实践之一。
