当前位置: 首页 > news >正文

前端实现回车键触发搜索

前端实现回车键触发搜索

    • 前言
    • 实现方法
      • 1. html里可以用 form 来实现
      • 2. 非form中的input

前言

搜索框是个常见的功能,除了用现有的ui组件库,有的时候必须要自己封装,所以涉及到点击按钮搜索和回车搜索都要实现

实现方法

1. html里可以用 form 来实现

button必须是submit类型

let submit=document.getElementById("sub");let val=document.getElementById("val");submit.addEventListener("click",()=>{alert("值是"+val.value)});

2. 非form中的input

let submit = document.getElementById("sub");let val = document.getElementById("val");val.onkeyup = function (event) {var e = event || window.event;console.log(event.keyCode);if (e && e.keyCode == 13) { //回车键的键值为13alert("值是: " + val.value);}};submit.onclick = function () {alert("值是" + val.value);}
http://www.lryc.cn/news/276843.html

相关文章:

  • k8s yaml文件pod的生命周期
  • MPEG4Extractor
  • 我在工作一年时怎么都看不懂的编程写法。今天手把手教给你
  • ThinkPHP5多小区物业管理系统源码(支持多小区)
  • 2024 年 API 安全:预测和趋势
  • 3D模型UV展开原理
  • SPL-cmcRVFL+
  • Vue3+TS+Vite 构建自动导入开发环境
  • 长期使用外接键盘,外物压着自带键盘,容易导致华硕飞行堡垒FX53VD键盘全部失灵【除电源键】
  • JavaScript-循环嵌套断点调试-笔记
  • 1042: 数列求和3 和 1057: 素数判定 和 1063: 最大公约与最小公倍
  • [足式机器人]Part2 Dr. CAN学习笔记-动态系统建模与分析 Ch02-8 Bode Plot伯德图
  • Java 将Excel转换为TXT文本格式
  • 什么事“网络水军”?他们的违法活动主要有四种形式
  • 授权策略(authorize方法)
  • FFmpeg获取音视频流信息
  • 编程语言的走向又将如何呢?
  • 基于SpringBoot的电影评论网站
  • 粒子群算法优化支持向量SVM的供热量预测,粒子群优化支持向量机SVM回归分析
  • 【Verilog】运算符
  • 浅析ARMv8体系结构:A64指令集
  • VSCode安装GitHub Copilot插件方法
  • 实战:使用docker容器化服务
  • 借用GitHub将typora图片文件快速上传CSDN
  • 外包公司干了2个月,技术退步明显了.......
  • PTA✨C语言 组合数的和
  • 这些开源自动化测试框架,会用等于白嫖一个w
  • 代码随想录第三十六天——无重叠区间,划分字母区间,合并区间
  • Python数据分析:入门到实践
  • 第7章-第9节-Java中的Stream流(链式调用)