Оптимизация горячих клавиш jQuery

Question

Итак, у меня есть веб-приложение, которое использует все горячие клавиши от А до Я.

Каждая горячая клавиша используется для вкладки. Так, например:

У меня 20 вкладок:

#tab1, #tab2, #tab3, #tab4 и т. Д. Все вкладки получают класс .tabs.

Итак, чтобы сработали горячие клавиши, я сделал это:

if (e.keyCode == 65) {$('.tabs:not(#tab1)').hide();$("#tab1").fadeIn();}
if (e.keyCode == 66) {$('.tabs:not(#tab2)').hide();$("#tab2").fadeIn();}
if (e.keyCode == 67) {$('.tabs:not(#tab3)').hide();$("#tab3").fadeIn();}
if (e.keyCode == 68) {$('.tabs:not(#tab4)').hide();$("#tab4").fadeIn();}
if (e.keyCode == 69) {$('.tabs:not(#tab5)').hide();$("#tab5").fadeIn();}
if (e.keyCode == 70) {$('.tabs:not(#tab6)').hide();$("#tab6").fadeIn();}
if (e.keyCode == 71) {$('.tabs:not(#tab7)').hide();$("#tab7").fadeIn();}
//etc till keycode 81 and tab20.

Итак, есть ли лучший способ оптимизации , чтобы сделать это так, чтобы оно было записано меньше символов? Так как в каждой строке я использую дважды один и тот же идентификатор.

Редактировать / Примечание: Извините, фактические идентификаторы вкладок являются случайными именами.

Спасибо

Answer 1

Что-то вроде этого возможно:

if(e.keyCode >= 65 && e.keyCode <= 81) {
    var tab = e.keyCode - 65 + 1;
    $('.tabs:not(#tab' + tab + ')').hide();
    $('#tab' + tab).fadeIn();
}

Я не вижу, как код клавиши 81 должен быть tab20, разве это не будет tab17?

---

Обновление : Если ваши вкладки id s могут быть чем угодно, просто бросьте их в массив:

var tab_ids = [ 'where', 'is', 'pancakes', 'house', ... ];
if(e.keyCode >= 65 && e.keyCode <= 81) {
    var tab = tab_ids[e.keyCode - 65];
    $('.tabs:not(#' + tab + ')').hide();
    $('#' + tab).fadeIn();
}

Если у вас также есть пробелы в кодах клавиш, используйте объект вместо массива:

var tab_ids = { 65: 'where', 70: 'is', 72: 'pancakes', 73: 'house', ... };
var tab     = tab_ids[e.keyCode];
if(tab) {
    $('.tabs:not(#' + tab + ')').hide();
    $('#' + tab).fadeIn();
}

Answer 2

Просто замените все эти операторы if на этот код

$('.tabs:not(#tab'+(e.keyCode-64)+')').hide();
$("#tab"+(e.keyCode-64)).fadeIn();

Answer 3

$('.tabs:not(#tab' + (e.keyCode - 64) + ')').hide();
$("#tab" + (e.keyCode - 64)).fadeIn();