最稳妥的回车登录方式是利用表单原生submit事件：将输入框和按钮包裹在form内，按钮type设为"submit"，并绑定onsubmit事件阻止默认行为后执行登录逻辑。
用 form 的 onsubmit 是最稳妥的方式
回车登录本质不是“按了回车就点按钮”，而是“表单提交”。浏览器原生行为是：在 form 内任一可编辑字段（input、textarea）中按回车，且表单内存在 type="submit" 按钮时，自动触发 submit 事件。所以优先用这个机制：
- 把登录输入框和按钮包进
<form></form>标签里 - 把登录按钮的
type改为"submit"（不是"button"） - 给
form绑定onsubmit事件，阻止默认提交并执行登录逻辑
示例：
<script> document.getElementById('loginForm').onsubmit = function(e) { e.preventDefault(); // 阻止页面刷新 const u = document.getElementById('username').value; const p = document.getElementById('password').value; login(u, p); // 你的登录函数 }; </script>
keydown 监听 body 或 input 容易出问题
直接监听 document 或 body 的 keydown，再判断 keyCode === 13，看似简单，但有多个隐患：
- 用户在非登录区域（比如弹窗、富文本框、搜索框）按回车也会触发，可能误登录
-
event.keyCode已废弃，应改用event.key === 'Enter'（兼容性更好） - 若页面有多个表单，或动态加载内容，全局监听容易冲突或漏绑定
- 移动端软键盘的“回车”键行为不一致，部分 Android 键盘发的是
'\n'而非'Enter'
如果必须监听键盘，建议只监听登录区域内的 input：
const inputs = document.querySelectorAll('#loginForm input');
inputs.forEach(el => el.addEventListener('keydown', e => {
if (e.key === 'Enter') {
e.preventDefault();
document.getElementById('loginForm').dispatchEvent(new Event('submit'));
}
}));
Vue / Element Plus 项目别直接绑 @keyup.enter 在 button 上
在 Vue 中，给 <el-button></el-button> 或原生 <button></button> 直接写 @keyup.enter="submit" 是无效的——按钮默认不聚焦，无法捕获键盘事件。
- 正确做法是：把
@keyup.enter绑在<form></form>或包裹输入框的<div> 上<li>使用 Element Plus 时，若组件封装了 <code>input（如<el-input></el-input>），需加.native修饰符才能监听原生事件 - 更推荐用
<el-form></el-form>的@submit.native.prevent，它天然适配回车提交
常见错误写法：
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
<el-button>登录</el-button><!-- ❌ 不会触发 -->
正确写法：
<el-form><el-input v-model="form.username"></el-input><el-input v-model="form.password" type="password"></el-input><el-button type="primary">登录</el-button></el-form>
jQuery 方式现在基本不用，但要注意 document.all 和选择器失效
老项目里常见这种写法：document.all('login').click() 或 $('#login').click()，它们依赖 jQuery 或 IE 时代 API，现在多数环境已不支持：
-
document.all是 IE 专有属性，现代浏览器返回undefined，直接报错 - jQuery 若未引入或版本过低（如 3.0+ 移除了
live()），$('...')可能找不到元素 - 用
document.getElementById更轻量、更可靠，且无需额外库
如果真要用 jQuery，请确保：
- jQuery 已正确加载（检查控制台无
$ is not defined） - ID 选择器与 HTML 中的
id完全一致（注意空格、大小写） - 脚本放在 DOM 加载后执行，或用
$(document).ready(...)
不过，纯 JS 已足够，没必要为这一个功能引入整个 jQuery。
实际项目里最容易被忽略的点，是没确认输入框是否真的在 form 内、按钮是否为 type="submit"，以及忘记 e.preventDefault() 导致页面刷新。这三个地方一错，回车就“看起来没反应”。
