问说网 · 发表于 2015-09-10

文章13116 · 评论469

MouseTrap扩展插件列表

字数3939 · 浏览 914 · 评论 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.

相关链接

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

问说网手机版

躺着 站着 跪着轻松访问

更多 热门话题

APP界面

APP界面

文章 41517

APP欣赏

APP欣赏

文章 41450

APP手机界面

APP手机界面

文章 41440

图片素材

图片素材

文章 29463

高清图片

高清图片

文章 26225

更多 推荐作者

问说网

文章 13116

GallupDarnell

文章 117

GibbonRoy

文章 119

StuartKelly

文章 114

YeatesGeoffrey

文章 113

发布评论

顶部 反馈 评论 底部

意见反馈

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

您的反馈我们已收到!

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