javascript - 优化 jQuery 热键

Question

所以我有一个网络应用程序，它使用从 A 到 Z 的所有热键。

每个热键用于一个选项卡。例如:

我有 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.

那么，有没有一种更好的优化方式来使它以更少的字符写入？因为在每一行我都使用了两次相同的 ID .

编辑/注意:抱歉，实际标签 ID 是随机名称。

谢谢

Answer 1

也许是这样的:

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

虽然我看不出 keycode 81 应该是 tab20，那不是 tab17 吗？

---

更新:如果您的标签页 id 可以是任何东西，那么只需将它们放入一个数组中即可:

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();
}