MouseTrap扩展插件列表

问说网 · 发布于 2015-09-10 · 字数3939 · 浏览 984 · 评论 0

任何的公共方法可以通过MouseTrap的扩展覆盖,得到新的功能,一些好用的插件列表如下,其中某些扩展让MouseTrap更加强大和完美。

Global bindings

View or Download

This extension allows you to specify keyboard events that will work anywhere including inside textarea/input fields.

Usage looks like:

Mousetrap.bindGlobal('ctrl+s', function() {
    _save();
});

This means that a keyboard event bound using Mousetrap.bind will only work outside of form input fields, but using Moustrap.bindGlobal will work in both places.

If you wanted to create keyboard shortcuts that only work when you are inside a specific textarea you can do that too by creating your own extension.

Bind dictionary

View or Download

This extension overwrites the default bind behavior and allows you to bind multiple combinations in a single bind call.

Usage looks like:

Mousetrap.bind({
    'a': function() { console.log('a'); },
    'b': function() { console.log('b'); }
});

You can optionally pass in keypress, keydown or keyup as a second argument.

Other bind calls work the same way as they do by default.

Pause/unpause

View or Download

This extension allows Mousetrap to be paused and unpaused without having to reset keyboard shortcuts and rebind them.

Usage looks like:

// stop Mousetrap events from firing
Mousetrap.pause();
// allow Mousetrap events to fire again
Mousetrap.unpause();

Record

View or Download

This extension allows you to record keyboard shortcuts from your application. For example if you wanted to let users specify their own keyboard shortcuts for performing actions on your page you could ask them to enter a shortcut.

Usage looks like:

<button onclick="recordSequence()">Record</button>

<script>
    function recordSequence() {
        Mousetrap.record(function(sequence) {
            // sequence is an array like ['ctrl+k', 'c']
            alert('You pressed: ' + sequence.join(' '));
        });
    }
</script>

Using extensions

To use any of these extensions all you have to do is include the javascript on your page after you include Mousetrap.

相关链接

本文系作者 问说网 授权问说网发表,并经问说网编辑,转载请注明出处和 本文链接

相关文章

  • 2017-01-19用JavaScript实现给出的盒子的序列是否可连为一矩型
  • 2016-12-02FlyJSONP轻量级的跨域AJAX请求插件
  • 2016-04-02JavaScript将地址栏参数拆分成键值对的对象
  • 2016-04-12网页设计中我们为什么要使用960PX宽度
  • 2016-12-02Response JS创建高性能的支持移动设备的网站
  • 2016-06-25分享20款优秀的Web移动开发框架
  • 2016-07-06详细讲解JAVA中的IO流
  • 2016-07-06Spring MVC文件上传
  • 发布评论

    为您推荐

    用JavaScript实现给出的盒子的序列是否可连为一矩型
    AustenJuliet · 发布于 2017-01-19

    用JavaScript实现给出的盒子的序列是否可连为一矩型

    by cpglkg <script>var arr=[5,10,15];function rect(arr,width){ arr.sort(fun…

    问说网 · 发布于 2016-12-02

    FlyJSONP轻量级的跨域AJAX请求插件

    FlyJSONP是一个JavaScript库,用于实现跨域GET和POST请求服务,支持JSONP,并取得一个JSON格式的数据响应,这个Library具有易于…

    问说网 · 发布于 2016-03-21

    Python如何使用Pdb调试代码

    今天花了点时间看了一下Python自带的pdb库,发现用pdb来调试程序还是很方便的,当然了,什么远程调试,多线程之类,Pdb是搞不定的。在交互环境中通常使用p…

    问说网 · 发布于 2016-12-02

    Response JS创建高性能的支持移动设备的网站

    Response JS 是一个轻量级的 jQuery 插件,用来创建高性能的支持移动设备的网站。它提供了一套语法用来根据不同的设备环境动态替换HTML代码。例如…

    三步制作出这种精美弥散阴影

    不知道大家有没有注意,从去年开始突然流行一种萌萌哒的阴影设计技巧,先看下面几张图(反正我是去年才开始用这种技巧的,可能是我知道的太晚 (*^__^*)) 看完后…

    • 三步制作出这种精美弥散阴影
    • 三步制作出这种精美弥散阴影
    • 三步制作出这种精美弥散阴影
    • 三步制作出这种精美弥散阴影
    PigouOlivia · 发布于 2016-05-17 · 浏览 1160 · 评论 0
    SweetTooltip基于jQuery和CSS3链接工具提示插件
    问说网 · 发布于 2016-07-01

    SweetTooltip基于jQuery和CSS3链接工具提示插件

    SweetTooltip 工具提示是一个基于jQuery和CSS3的工具提示,它不仅仅是一个风格,而是有七种风格。这种无背景图风格的工具提示制作使用线性梯度,阴…

    问说网 · 发布于 2016-07-05

    刷流量的注意了使用流量宝可能会中毒!

    相信大家都知道刷流量的有很多软件,最著名的就是流量精灵和流量宝,而我一直使用的流量宝,两个软件的使用基本差不多,可是你知道吗?使用流量刷流量可能会中毒,这不是危…

    Vincent · 发布于 2016-07-06

    Java Web的安全验证机制

    部署描述符中的security-constraint元素允许不通过编程就可以限制对某个资源的访问。

    问说网手机版

    躺着 站着 跪着轻松访问

    更多详情 关于作者

    问说网

    问说网分享与设计有关的文章素材界面和作品,提供设计教程、素材分享、界面欣赏、编程设计、设计书籍、设计师导航等内容,你可以在这里阅读、学习、分享、交流。

    13130 文章
    495 评论
    2052 人气

    更多 热门话题

    APP界面

    关注 APP界面

    文章 41506 · 浏览 2780

    APP欣赏

    关注 APP欣赏

    文章 41427 · 浏览 2604

    APP手机界面

    关注 APP手机界面

    文章 41417 · 浏览 2684

    图片素材

    关注 图片素材

    文章 29463 · 浏览 2129

    高清图片

    关注 高清图片

    文章 26530 · 浏览 2339

    更多 推荐作者

    关注 惢碎葬爱

    文章 96 · 评论 0

    关注 溫柔的溫柔

    文章 91 · 评论 0

    关注 走了留下什么

    文章 110 · 评论 0

    关注 流浪的脚步

    文章 86 · 评论 0

    关注 籹孒不认输

    文章 94 · 评论 0

    关注 思念像咒语

    文章 102 · 评论 0

    
    顶部 反馈 评论 底部

    意见反馈

    感谢您对问说网的支持,提出您在使用过程中遇到的问题或宝贵建议,您的反馈对我们产品的完善有很大帮助。

    您的反馈我们已收到!

    感谢您提供的宝贵意见,我们会在1-2个工作日,通过您留下的联系方式将处理结果反馈给您!