zoukankan      html  css  js  c++  java
  • JavaScript(js)处理的HTML事件、键盘事件、鼠标事件

     


    示例代码:

    HTML文件:

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>HTML文件</title>
    <script>
    window.onload=function () {
    var d=document.getElementById('d');
    //内容发生改变,并焦点发生改变,才可以监听到
    d.onchange=function () {
    alert('内容发生改变')
    }
    }
    </script>
    </head>
    <body>
    <input type="text" id="d" value="">
    </body>
    </html>
    键盘事件:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>键盘事件</title>
    <script>
    window.onload=function () {
    window.onkeypress=function (e) {
    // alert(e.key)//弹出按键对应的字母
    // alert(e.keyCode)
    if (e.charCode==103){
    alert('G键被点击')
    }
    }
    }
    </script>
    </head>
    <body>

    </body>
    </html>
    鼠标事件:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>鼠标事件</title>
    <script>
    window.onload=function () {
    var input=document.getElementById('b');
    input.onclick=function () {
    alert('按钮被点击了');
    }

    var c= document.getElementById('c');
    c.ondblclick=function () {
    alert('双击')
    }
    }
    </script>
    </head>
    <body>
    <input type="button" id="b" value="点击">
    <input type="button" id="c" value="双击">
    </body>
    </html>

  • 相关阅读:
    codeforces567E. President and Roads
    codeforces 573C Bear and Drawing
    bzoj4160: [Neerc2009]Exclusive Access 2
    bzoj1251: 序列终结者
    bzoj2534: Uva10829L-gap字符串
    Excel中导入到oracle使用merge into 差异性更新数据库
    文件解压缩公用类
    XML常用操作
    密码加密解密
    GridView中数据行的操作
  • 原文地址:https://www.cnblogs.com/web-chuanfa/p/10605439.html
Copyright © 2011-2022 走看看