Question

我正在尝试创建一个数字翻译器，将数字从一种语言翻译成另一种语言。不幸的是，它不起作用。我的错是什么？或者我误会了什么？非常感谢！

＆＃13;

<html>
<head>
<title>LT3210 example: for loop</title>

<script>
function translate()
{
	var engNum = ["zero", "one", "two", "three", "four", "five", "six", "seven", "eight", "nine", "ten"];
	var chiNum = ["零", "一", "二", "三", "四", "五", "六", "七", "八", "九", "十"];

	var myEngNum = document.getElementById("num_input").value;
	var trans = "";
	for (var i = 0; i < engNum.length; i++)
	{ var curEngNum = engNum[i];
		while(myEngNum == curEngNum){
			trans = chiNum[i];
			document.getElementById("output").innerHTML = trans;
		}
	}
}
</script>
</head>
<body>
<h1>Number Translator</h1>
<form>
<input type="text" id="num_input" size="30" placeholder="Enter a number in English" />
</form>
<br />
<button onclick="translate()">Translate</button>
<br />
<p id="output">??</p>
</body>
</html>

＆＃13;

Answer 1

首先，您不能将translate用作函数名称。

其次，您需要执行if语句而不是while循环。

<html>
<head>
<title>LT3210 example: for loop</title>

<script>
function translate2()
{
	var engNum = ["zero", "one", "two", "three", "four", "five", "six", "seven", "eight", "nine", "ten"];
	var chiNum = ["零", "一", "二", "三", "四", "五", "六", "七", "八", "九", "十"];

	var myEngNum = document.getElementById("num_input").value;
	var trans = "";
	for (var i = 0; i < engNum.length; i++)
	{ 
      var curEngNum = engNum[i];
		if(myEngNum == curEngNum){
			trans = chiNum[i];
			document.getElementById("output").innerHTML = trans;
		}
	}
}
</script>
</head>
<body>
<h1>Number Translator</h1>
<form>
<input type="text" id="num_input" size="30" placeholder="Enter a number in English" />
</form>
<br />
<button onclick="translate2()">Translate</button>
<br />
<p id="output">??</p>
</body>
</html>

Answer 2

首先，<button>有一个名为translate的属性，因此如果您想使用全局函数，则必须使用window.translate才能正确解析。

其次，在处理非HTML时，您应该使用textContent而不是innerHTML。

第三，你可以通过使用Array.indexOf和||运算符来处理这两个循环并使翻译更简单：

var myEngNum = document.getElementById("num_input").value;
var index = engNum.indexOf(myEngNum);
// If index == -1, chiNum[index] will evaluate to undefined, so we || it with '??'
var trans = chiNum[index] || '??';
document.getElementById("output").textContent = trans;

或者，作为一个单行：

document.getElementById("output").textContent = chiNum[engNum.indexOf(document.getElementById("num_input").value)] '??';

您的代码已完全修复：

＆＃13;

<html>
<head>
    <title>LT3210 example: for loop</title>
    <script>
    function translate()
    {
        var engNum = ["zero", "one", "two", "three", "four", "five", "six", "seven", "eight", "nine", "ten"];
        var chiNum = ["零", "一", "二", "三", "四", "五", "六", "七", "八", "九", "十"];
        document.getElementById("output").textContent = chiNum[engNum.indexOf(document.getElementById("num_input").value)] || '??';
    }
    </script>
</head>
<body>
    <h1>Number Translator</h1>
    <form>
    <input type="text" id="num_input" size="30" placeholder="Enter a number in English" />
    </form>
    <br />
    <button onclick="window.translate()">Translate</button>
    <br />
    <p id="output">??</p>
</body>
</html>

＆＃13;

JavaScript for循环：如何使我的号码翻译工作？

2 个答案: