html 键盘按键与按钮功能关联

键盘中每个按键都对应一个数值,通过匹配进行功能函数得划分,主要使用得是键盘按键事件,onkeydown;案例如下:


<html >
<head>
    <title>title>
head>
<script type="text/javascript">
    function init(){
        //页面键盘点击时触发
        document.οnkeydοwn=showKeyDown;
    }
    function showKeyDown(evt){
        evt = (evt) ? evt : window.event ;

        if(evt.keyCode==38){
            fun1(); 
        }
        if(evt.keyCode==40){
            fun2(); 
        }
    }
    function fun1(){
        alert("功能一测试");
    }
    function fun2(){
        alert("功能二测试");
    }

script>
<body onload="init()">
    <div align="center">
        <p>说明:键盘"上"为功能一测试p>
        <p>键盘"下"为功能二测试p>
        <button onclick="fun1()">功能一测试button>
        <button onclick="fun2()">功能二测试button>
    div>

body>
html>

操作结果如图:
html 键盘按键与按钮功能关联_第1张图片
更多可以参考以下博文:
js键盘按钮keyCode及示例大全:https://www.cnblogs.com/daysme/p/6272570.html
键盘按钮keyCode大全: https://www.cnblogs.com/shyy/archive/2012/04/09/2453029.html

你可能感兴趣的:(前端)