zoukankan      html  css  js  c++  java
  • 模拟京东按键输入内容

    案例分析:

    1.检测用户是否按下s键,如果按下s键,就把光标定位到搜索框里面;

    2.使用键盘事件对象里面的keyCode判断用户按下的是否是s键;

    3.搜索框获得焦点:使用js里面的focus()方法。

    效果(按下键盘上s键,搜索框会获得焦点):

    代码:

     1 <!DOCTYPE html>
     2 <html lang="en">
     3     <head>
     4         <meta charset="UTF-8">
     5         <title>京东按键输入内容</title>
     6     </head>
     7     <body>
     8         <input type="text">
     9         <script>
    10             var search = document.querySelector('input');
    11             document.addEventListener('keyup',function(e){
    12                 //用keyup弹起的时候获取焦点,s不会输入
    13                 //用keydown的话按下的时候就获取焦点,s会加入到搜索框里面
    14                 // console.log(e.keyCode);
    15                 if(e.keyCode === 83){
    16                     search.focus();         //搜索框获取焦点
    17                 }
    18             })
    19         </script>
    20     </body>
    21 </html>
  • 相关阅读:
    se 键盘鼠标操作事件
    警告框操作方法(alert弹窗)
    se自带截图方法
    CSS Selector 高级用法
    吃奶酪
    互不侵犯
    hdu1102
    P4744 Iron man
    玉米田
    状压dp题单
  • 原文地址:https://www.cnblogs.com/cy1227/p/12910494.html
Copyright © 2011-2022 走看看