键盘回车事件导致页面刷新的问题

最新推荐文章于 2025-06-18 10:00:00 发布

ins_lizhiming

最新推荐文章于 2025-06-18 10:00:00 发布

阅读量943

点赞数 2

CC 4.0 BY-SA版权

文章标签： js

本文链接：https://blog.youkuaiyun.com/qq_39146974/article/details/82775465

本文介绍了一个简单的搜索框功能实现中遇到的问题：当用户按下回车键时页面出现闪现并自动刷新。通过添加一个隐藏的输入框解决了此问题，并避免了页面刷新。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

键盘回车事件导致页面刷新的问题

这个问题把我困扰了整整一天，
功能很简单，就是一个搜索框，然后回车时候可以搜索出内容，
但是回车后内容出现了闪现的情况。

很是郁闷，

搞了一天才明白

<input type="text" value="" class="form-control" id="search" placeholder="Search dashboard...">
 <input type="text" value="" class="form-control" id="search" placeholder=Search dashboard..." style="display:none">
<span class="input-group-btn"><button type="button" id="btn_search" class="btn btn-primary">Go</button></span>

最大的问题就是

js里面

$(document).keydown(function (ev) {
    if(ev.keyCode == '13'){
        // Ebook=document.getElementById("search").value
        // localStorage.setItem("sea",Ebook)
        InitData();
    }
})

keydown的时候，如果只有一个输入框，页面就会自动刷新，

所以添加一个隐藏的输入框就可以了。

这么简单的问题，竟然困扰了这么久