页面上实现回车触发登录

最新推荐文章于 2024-08-27 14:54:05 发布

山外人家

最新推荐文章于 2024-08-27 14:54:05 发布

阅读量4.8k

点赞数

分类专栏：日常总结文章标签： js 前端回车 keyCode

本文链接：https://blog.csdn.net/liyujia6636/article/details/79512508

版权

这篇博客记录了在创建登录界面时遇到的问题及解决方案。最初，keyup事件添加到div元素上，仅在input获得焦点时触发。为确保无论input是否聚焦都能响应回车登录，事件监听器被改为绑定到body元素上。通过这个修改，成功实现了无论输入框状态如何，回车键都能触发登录功能。

摘要由CSDN通过智能技术生成

需求描述

做了个登录界面时，需要实现回车登录，就是添加keyup事件，但是添加到哪个元素上时，略有不同，一个是根元素的div上，结果只有聚焦到input中时才触发keyup事件。后来改到了body上解决了问题，无论input聚焦还是失焦都可以触发，特此记录。

代码

写了个例子，只是演示回车登录，没有具体功能

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>回车登录</title>
    <style>
        .login {