if-else 语句过多。它们可以全球化吗？

Question

我正在尝试简化这个脚本。我有 50 个这样的 if e.keyCode 语句，因此双重嵌套 if/else 语句看起来很荒谬，但我所做的所有其他尝试都没有奏效。

第一个 if/else 语句 if(e.keyCode == 66 && e.shiftKey) 是必要的，但我不确定第二个 if (typedAdjusted >= paperWidth % charWidth) 如果相对于固定宽度在一行上输入太多字符，则会发出警告。

if (typedAdjusted >= paperWidth % charWidth) 功能可以为我提供全局功能吗？需要根据特定的密钥代码进行检查。例如，字母“B”应该被计算为 typedAdjusted，而 BACKSPACE、TAB 和 COMMAND 则不应该。

var typed = $("span.char").length;
var typedAdjusted = typed+1;
var paperWidth = 900;
var charWidth = 44;

if (e.keyCode  == 66)  {
    if (e.keyCode  == 66  && e.shiftKey)  {
        $('#charLine-1').append('<span class="char">B</span>');
        if (typedAdjusted  >= paperWidth % charWidth) {
            $('body').append('<span id="warning">WARNING!</span>');
        }
        else {
            return false;
        }
    } 
    else  {
        $('#charLine-1').append('<span class="char">b</span>');
        if (typedAdjusted  >= paperWidth % charWidth) {
            $('body').append('<span id="warning">WARNING!</span>');
        }
        else {
            return false;
        }        
    }
}

Answer 1

你说有 50 个是什么意思？你……不是说每个字母一个吗？

为什么要检查两次键码值？您是否发现代码除了字符之外完全相同？

保留一个查找表或直接字符转换，并将其缩短为单个方法：

var c = lookup(e.keyCode, e.shiftKey);
$('#charLine-1').append('<span class="char">' + c + '</span>');
if (typedAdjusted  >= paperWidth % charWidth) {
    $('body').append('<span id="warning">WARNING!</span>');
} else {
    return false;
}

这将创建一大堆跨度。

---

var normal = {
  66: 'b', 67: 'c', // etc.
};

var shifted = {
  66: 'B', 67: 'C', // etc.
};

/** 
 * Looks up keycode using appropriate map.
 *
 * Returns `undefined` if not found; shouldn't insert.
 */
function lookup(code, shift) {
  return shift ? shifted[code] : normal[code];
}

Answer 2

如果您喜欢检查每一项，请使用开关：根据需要传递事件调用 checkKey 函数。

function checklen() {
    var typed = $("span.char").length;
    var typedAdjusted = typed + 1;
    var paperWidth = 900;
    var charWidth = 44;
    return (typedAdjusted >= paperWidth % charWidth);
}

function checkKey(e) {
    var mychar = '';
    var checkit = false;
    switch (e.keyCode) {
    case 66:
        mychar = e.shiftKey ? 'B' : 'b';
        checkit = checklen();
        break;
    case 67:
        mychar = e.shiftKey ? 'C' : 'c';
        checkit = checklen();
        break;
    case 68:
        mychar = e.shiftKey ? 'D' : 'd';
        checkit = checklen();
        break;

    default:
        checkit = false;
        break;
    }
    if (!checkit) {
        $('#charLine-1').append('<span class="char">' + mychar + '</span>');
    }
    else {
        $('body').append('<span id="warning">WARNING!</span>');
    }
}

要让它在整个文档上工作：

$(document).ready(function(){
  $(document).keydown(function(e) { 
     checkKey(e);
  });
});

然后只需单击页面并键入字符 - 仅注意上面代码中的“b”、“c”、“d”。

Answer 3

如果您观察按键事件，则可以使用 String.fromCharCode(event.keyCode) 来获取输入的字符，而不必弄乱查找表。

function (event) {
    var key = event.keyCode;
    if (key > 31 && key < 127) return String.fromCharCode(key);
}