在 JavaScript 中使用带有字符串的开关

Posted 2023-05-07

【中文标题】在 JavaScript 中使用带有字符串的开关

【英文标题】：Using a switch with strings in JavaScript

【发布时间】：2011-05-14 07:45:19

【问题描述】：

我的switch 语句在分析字符串变量时无法正常工作。

输出和输入都是<textarea>的。

HTML

<form name="interface">
  <textarea name="output" rows="20" cols="100"></textarea><br>
  <textarea name="input" rows="1" cols="100" onKeyDown="thinkInput(event);"></textarea>
</form>

JavaScript

function thinkInput(e)

    if (e.keyCode == 13)
    
        sInput = document.interface.input.value;
        document.interface.output.value += sInput;
        aInput = sInput.split(" ");

        switch (aInput[0])
        
            case "say":
                textOut("You say \""+sInput.substring(aInput[0].length + 1)+"\"");
                break;
            case "move":
                move(aInput[1]);
                break;
            default:
                thinkFail();
                break;
        
        document.interface.input.value = null;
        alert(aInput[0]);
    

我可以在最后的alert() 中看到该案例是“说”或“移动”。

我第一次尝试“说 mudkipz”或“四处走动”时，一切正常，但之后我输入的所有内容，thinkFail() 都会触发。

【参考方案1】：

由于命令提示符上方出现新行，并且拆分数组不包含 [0] 值上的引用第一个单词，因此您的代码未执行。不知道为什么，即使您正在清除 input 的值。

由于您在此输入中只需要一行，我建议使用<input type="text" onKeyDown="thinkInput(event);"/> 以避免在输入时出现新行。

JavaScript

this.thinkInput = function (e)
   
    ...

    if (e.keyCode == 13)
       
        /* Prevent submitting form on Enter */ 
        e.preventDefault();

        var command, commands;

        command = cmd.value;
        commands = command.split(' ');
        /* Clear input field */
        cmd.value = '';

        /* commands[0] will always have reference
           to the first word in textfield */
        switch (commands[0])
        
            ...
        
    

这是我从你的代码中拼凑出来的一个小玩意儿：http://jsfiddle.net/npx86/1/

希望这会有所帮助！

【参考方案2】：

一个问题是您没有使用var 语句来定义变量。这意味着它们成为“隐式全局变量”，并通过您的不同调用保留。

var sInput = document.interface.input.value;
var aInput = sInput.split(" ");
document.interface.output.value += sInput;

要进一步诊断问题，您可以使用浏览器中的调试器工具插入断点，并逐步监控sInput 的值并定位问题。

【讨论】：

对不起，我在这个函数之前声明了变量：var sInput; var aInput = new Array();

很好地检查了你的代码，它确实有效......做了一些修改以使用 jQuery：var sInput =$('#input').val(); $('#output').val($('#output').val() + sInput); var aInput = sInput.split(" "); switch (aInput[0]) case "say": alert("你说\""+sInput.substring(aInput[0].length + 1)+"\"");休息;案例“移动”：警报（aInput[1]）；休息;默认值：警报（“thinkFail”）；休息; $('#input').val('');

感谢萤火虫，我以前从未听说过。我回家后去试试看:)

奇怪...为什么我再试一次它在我的笔记本电脑 o.0 上不起作用；;

在您为 jQuery 更改代码之前，我的代码是否有效？我对 jQuery XD 一无所知我想知道你是否在更改它时解决了这个问题。

【参考方案3】：

发生这种情况是因为在将input 框值重置为空后，添加了按下的键（回车）。这会导致 aInput[0] 以 CR 开头（您不会在 alert() 消息中看到。

您可以在拆分之前通过修剪sInput 的左侧轻松解决此问题：

aInput = sInput.replace(/^\s+/,'').split(" ");

或者，您可以通过在按下<CR> 时从函数中显式返回false 来取消keydown 事件，并将html 更改为：

onkeydown="return thinkInput(event);"

【参考方案4】：

你试过这些吗？

最后

document.interface.input.value = ""; 

确实应该是空字符串，如 null + "hello" > "nullhello"

或在开始时

document.interface.output.value = sInput; 

如果每次都重置输出值，添加字符串是否真的有用？

【参考方案5】：

将此行放在开关之前 ....

aInput = sInput.split(" ");
aInput[0] = aInput[0].replace(/\s/gi, "");

switch (aInput[0])

....

或者您可以使用文本输入，而不是 textarea。

【参考方案6】：

我知道这个问题已经有一段时间了，但无论如何我必须提供一个答案。

您的代码不起作用的原因是第一次尝试后输入的 Textarea 不为空。代码运行后，换行符仍然添加到 textarea 中，下次按 enter 时，它是输入中的第一个字符。

如果您将 onKeyDown 更改为 onKeyUp 或为 onKeyUp 添加新的 eventHandler 以清空输入，您应该没问题。

<textarea name="input" rows="3" cols="100" onKeyUp="thinkInput(event);"></textarea>

http://jsfiddle.net/borglinm/ntj3t/1/

【参考方案7】：

也许我遗漏了一些东西...当我查看/测试此代码时，它会在每次触发 keydown 事件时运行，因为您正在清除输入字段，我们只使用单个字符。

如果我输入“say”，那么代码将使用“s”执行，然后 “a”，然后是“y”。

如果您想在 textarea 中扫描这些单词，我建议您提取 document.interface.output.value 的值并将该值与您的情况进行比较。

希望这会有所帮助。

编辑：你能发布你的 move 方法、textOut 方法和 thinkFail 方法吗？据我所知，如果遇到任何异常，那就是案例不起作用的时候。我创建了一个jsfiddle，它工作正常。

【讨论】：

'if (e.keyCode == 13)' 不意味着它只运行回车吗？

@DavidSykes 感谢您指出这一点。这个问题我看的不够仔细。我要修改我的答案。