使用热键导航选项卡

Question

如何使用以下热键实现的快捷键在不同选项卡之间导航：https://github.com/jeresig/jquery.hotkeys。

<div class="box-content">
                <ul class="nav nav-tabs" id="myTab">
                    <li class="active"><a href="#info">Info</a></li>
                    <li><a href="#custom">Custom</a></li>
                    <li><a href="#messages">Messages</a></li>
                </ul>

                <div id="myTabContent" class="tab-content">
                    <div class="tab-pane active" id="info">
                        <h3>Charisma
                            <small>a full featured template</small>
                        </h3>
                        <p>Its a full featured, responsive template for your admin panel. It is optimized for tablets
                            and mobile phones.</p>

                        <p>Check how it looks on different devices:</p>
                        <a href="http://www.responsinator.com/?url=usman.it%2Fthemes%2Fcharisma"
                           target="_blank"><strong>Preview on iPhone size.</strong></a>
                        <br>
                        <a href="http://www.responsinator.com/?url=usman.it%2Fthemes%2Fcharisma"
                           target="_blank"><strong>Preview on iPad size.</strong></a>
                    </div>
                    <div class="tab-pane" id="custom">
                        <h3>Custom
                            <small>small text</small>
                        </h3>
                        <p>Sample paragraph.</p>

                        <p>Your custom text.</p>
                    </div>
                    <div class="tab-pane" id="messages">
                        <h3>Messages
                            <small>small text</small>
                        </h3>
                        <p>Sample paragraph.</p>

                        <p>Your custom text.</p>
                    </div>
                </div>
            </div>

我的热键脚本实现如下：

 <script src="<?php echo base_url(); ?>assets/hotkeys/jquery-1.4.2.js"></script>
            <script src="<?php echo base_url(); ?>assets/hotkeys/jquery.hotkeys.js"></script>
            <script>
                var y = jQuery.noConflict();

                y(document).ready(function () {
                    y(document).bind('keydown', 'shift+w', function () {
                        y('#messages')[0].tabs();

                    })
                });

            </script>

我如何实现这一点，以便当我按下 shift 和 w (shift+w) 时，它会打开消息选项卡？使用选项卡失败。

Answer 1

function activaTab(tab){
    $('.nav-tabs a[href="#' + tab + '"]').tab('show');
};

y(document).ready(function () {
  y(document).bind('keydown', 'shift+w', function () {
    activaTab('messages');
  })
});

你能试试这个吗，我还没试过，但代码看起来不错！

使用热键导航选项卡

Using Hotkeys to navigate tabs

jquery

hotkeys

jquery-hotkeys

twitter-bootstrap-3