MouseTrap扩展插件列表

问说网 · 发布于 2015-09-10 · 字数3939 · 浏览 939 · 评论 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.

相关链接

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

相关文章

  • 2015-11-18使用jQuery.imgpreload预加载图片提高用户体验
  • 2016-01-24Phoc可编程的JavaScript计算器
  • 2017-01-19用JavaScript实现给出的盒子的序列是否可连为一矩型
  • 2016-03-03WOW.js页面滚动元素动画JavaScript插件
  • 2016-04-03JpGraph面向对象PHP图形生成库
  • 2016-04-08分享向各大网站提交Sitemap入口和方法
  • 2016-05-14大开眼界!20个炫酷好玩儿的网页导航设计
  • 2016-12-02Response JS创建高性能的支持移动设备的网站
  • 发布评论

    为您推荐

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

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

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

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

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

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

    高效利用工作时间!交互设计师每天是怎么工作的?
    LowellTiffany · 发布于 2016-05-16

    高效利用工作时间!交互设计师每天是怎么工作的?

    今天@EDC尤原庆华为设计总监,他分别列出了自己在美国、德国和中国的交互设计工作经历,来教我们如何高效利用工作时间,全都井井有条且轻重得当,最后还附上设计师工作…

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

    CxImage优秀图像操作类库使用和简介

    CxImage类库是一个优秀的图像操作类库,基于C++语言开发。它可以快捷地存取、显示、转换各种图像,支持BMP, JPEG, GIF, PNG, TIFF, …

    教你绘制一枚经典的ITUNES图标

    今天的iTunes图标是一个非常经典的icon,不过现在你们看不到了。现在的版本只能说是走火入魔,推崇扁平化,说它漂亮也谈不上,说难看也不至于~ 下面是我完成的…

    • 教你绘制一枚经典的ITUNES图标
    • 教你绘制一枚经典的ITUNES图标
    • 教你绘制一枚经典的ITUNES图标
    • 教你绘制一枚经典的ITUNES图标
    ClaphamAndrea · 发布于 2016-05-17 · 浏览 940 · 评论 0

    一款APP从设计稿到切图全揭秘

    我本身是一名GUI设计师,所以我只站在GUI设计师的角度去把APP从项目启动到切片输出的过程写一写,相当于工作流程的介绍吧。公司不同,流程不尽相同,但是终究还是…

    • 一款APP从设计稿到切图全揭秘
    • 一款APP从设计稿到切图全揭秘
    • 一款APP从设计稿到切图全揭秘
    • 一款APP从设计稿到切图全揭秘
    ONeilMerry · 发布于 2016-03-08 · 浏览 946 · 评论 0
    分享20款优秀的Web移动开发框架
    问说网 · 发布于 2016-06-25

    分享20款优秀的Web移动开发框架

    移动开发框架可以帮助开发者快速开发出满足需求的Web移动应用和网站,本文收集了20款针对开发者的移动开发框架,供开发者借鉴使用。

    问说网 · 发布于 2016-06-28

    jqFloat.js实现页面元素的浮动效果jQuery插件

    jqFloat.js是一个jQuery插件,能够让网页里面的任意元素浮动,并且可以实现动画效果,支持鼠标响应事件,并且它是跨浏览器兼容的,使用简单方便,它有助于…

    问说网手机版

    躺着 站着 跪着轻松访问

    更多详情 关于作者

    问说网

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

    13086 文章
    493 评论
    1865 人气

    更多 热门话题

    APP界面

    关注 APP界面

    文章 41506 · 浏览 1574

    APP欣赏

    关注 APP欣赏

    文章 41427 · 浏览 1506

    APP手机界面

    关注 APP手机界面

    文章 41417 · 浏览 1522

    图片素材

    关注 图片素材

    文章 29463 · 浏览 1026

    高清图片

    关注 高清图片

    文章 26530 · 浏览 1217

    更多 推荐作者

    关注 秋天的孤寂

    文章 99 · 评论 0

    关注 怎麽继续

    文章 90 · 评论 2

    关注 倾听寂寞

    文章 83 · 评论 0

    关注 溫柔的溫柔

    文章 91 · 评论 0

    关注 走了留下什么

    文章 110 · 评论 0

    关注 莪很迷茫

    文章 97 · 评论 0

    顶部 反馈 评论 底部

    意见反馈

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

    您的反馈我们已收到!

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