如何解決JavaScript提示中用戶輸入的錯字？

Question

首先，你好！ 我是這個網站的新手，因此對在發布過程中出現的任何錯誤深表歉意。

我在網絡技術課程中，我們正在學習JavaScript。 在上一課中，我們學習了HTML5和CSS。 我們當前的任務是制作一個網頁，當用戶在提示窗口中輸入相應的單詞時，該網頁將顯示3張圖片中的1張或不顯示圖片。

我想知道是否有一種方法可以解決用戶輸入的錯字？ 例如，我已經在代碼“ Spn”中使用了，但是想知道是否有一種方法可以輕松地實現它，以便如果用戶錯誤輸入“ Son”，仍然可以看到他們的圖像。 有沒有一種方法而不必添加單獨的if語句？

下面是到目前為止的代碼，其中包括我的小“測試”，以查看是否可以執行此操作。 我以為只有兩個項目（例如：“ Spn”，“ spn”）有效，但是當我添加了第三個項目時它就停止工作了，現在又不再起作用了。我很可能會誤認為那里曾經是成功的。

哦，而且，我們只允許使用JavaScript，HTML和CSS。 因此，如果您的解決方案是jquery（我不知道那是什么），那么謝謝您，但恐怕我無法使用它。

如果您需要其他任何信息，請告訴我，我們很樂意為您提供。 非常感謝您的幫助，非常感謝！ -Carly

JavaScript代碼（文件名為switch.js）：

var temp = "None";


function choose()
    {
        temp = prompt("Spn, DW, SH, or None?");

            if (temp == "Spn","spn")
                {
                    document.getElementById("picture").src="first.jpg";
                    document.getElementById("sub").innerHTML="Supernatural";
                    document.getElementById("picture").style.visibility="visible";
                };
            if (temp == "DW","dw","Dw")
                {
                    document.getElementById("picture").src="second.jpg";
                    document.getElementById("sub").innerHTML="Doctor Who";
                    document.getElementById("picture").style.visibility="visible";
                };
            if (temp == "SH","sh","Sh")
                {
                    document.getElementById("picture").src="third.jpg";
                    document.getElementById("sub").innerHTML="Sherlock";
                    document.getElementById("picture").style.visibility="visible";
                };
            if (temp == "None","none")
                {
                    document.getElementById("picture").src="blank.jpg";
                    document.getElementById("sub").innerHTML="Click button to reveal image";
                    document.getElementById("picture").style.visibility="hidden";
                };
    }

HTML代碼（文件名為userchoice.html）：

<!doctype html>
<html>

<head>
    <link rel="stylesheet" type="text/css" href="style.css">
    <script src="switch.js"></script>
    <title>What is this not working I'm going to cry</title>
</head>

<body>
    <h1>SuperWhoLock</h1>
    <h2 id="sub">Click button to reveal image</h2>

    <div id="picblock">
        <img src="blank.jpg" id="picture">
    </div>

    <div id="buttons">
        <button onclick="choose()">Choose Picture</button>
    </div>
</body>

</html>

CSS代碼（文件名為style.css）：

body  
    { background-image:url('background.jpg');
    }




h1
    { width: 25%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    background: black;
    color: white;
    }

h2
    { width: 25%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    background: white;
    color: black;
    }

#picblock
    { width: 25%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    }

#picture
    {visibility:hidden;
    }


#buttons
    { text-align: center;
    margin-left: auto;
    margin-right: auto;
    }

Answer 1

除非將智能放入代碼中，否則我將給出一種相當簡單的方法，下面將詳細介紹：

由於您是決定“ Son”應該拉出理想的“ Spn”圖像的人，因此，我們應該使用由您自己創建的映射。 我們可以有這樣的事情：

`

var spn = "Spn", dw ="DW",sh="SH";

//creating a custom mapping
var dict = {
"Son":spn,
"Sln":spn,
"Spn":spn,
"DW":dw,
"DE":dw,
"SH":sh

}

//Your if would look like:
temp = (dict && dict[temp])?dict[temp]:null;

if (temp && temp.toLower() == "spn")

`2.對於創建該詞典，您只需考慮要鍵入的字母周圍的字符。

注意：此方法假定您僅需要比較這三件事。 如果您想要一個更通用的解決方案，而該解決方案應該可以在Spn，DW，SH，None之外運行，請告訴我。

如何解決JavaScript提示中用戶輸入的錯字？

問題描述

1 個解決方案

解決方案1
1 2014-02-09 20:07:32

如何解決JavaScript提示中用戶輸入的錯字？

問題描述

1 個解決方案

解決方案1 1 2014-02-09 20:07:32

解決方案1
1 2014-02-09 20:07:32