[原创]Javascript 利用mousetrap.js进行键盘事件操做

时间 2019-11-25

标签原创 javascript 利用 mousetrap.js mousetrap 进行键盘事件栏目 JavaScript 繁體版

原文原文链接

咱们平常开发中，会遇到js的键盘操做，例如回车提交表单之类的。或者按下某个键执行某个方法。无心中发现一个大小不到4K的js文件，它很是方便的操做键盘事件。javascript

本身也尝试了一下：具体代码以下：html

详情能够去其逛网查看其API并下载，地址：http://craig.is/killing/micejava

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="js/mousetrap.min.js" type="text/javascript"></script>
    <script src="js/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            Mousetrap.bind('4', function () { alert("按下了4键"); });jquery

            Mousetrap.bind('enter', function () { alert("按下了enter键"); });
            Mousetrap.bind('x', function () { alert("按下了x键"); }, 'keyup');git

            Mousetrap.bind('shift+k', function (e) {
                alert("按下了组合键shift+k");
                return false;
            });github

        });</script>
</head>
<body>
</body>
</html>xml

效果图：htm

特此记录一下。方便之后查找，也但愿给刚恰好有此须要的人带了一些帮助。blog

PS：固然也还有其它JS库选择，如Keyboard.js,地址：https://github.com/RobertWHurst/KeyboardJS，但我的感受这个文件体积较大有20多K。因此没有太多特殊需求的话，推荐mousetrap.js 事件