Question

我需要有关功课的帮助。这是我一段时间以来一直坚持的一项任务。这是作业说明：

使用单词“ Hej”，“ Nej”，“ EJ”，“ Leverpastej”，“ 42”创建一个数组。通过表格，用户必须能够写一个数字，然后您应该在数组中显示该位置的单词。例如：输入用户2，应显示单词“ EJ”。

好吧，老实说，我对这项工作感到迷茫，我需要我能得到的所有帮助和建议。所以请帮帮我。也许建议我如何使用for循环之类的东西。

谢谢！

    function getFunction() {
        var rimm [];

        rimm[0] = "Hej";
        rimm[1] = "Nej";
        rimm[2] = "EJ";
        rimm[3] = "Leverpastej";
        rimm[4] = "42";

        for (var i = 0; i < rimm.length; i++) {
            if (rimm[i] == "Nej") {
                document.getElementById("skit").innerHTML += " " + rimm[i];
            }
            else {
                document.getElementById("skit").innerHTML += " " + rimm[i];
            }

            document.getElementById("getnumber").value = rimm[];
    }

<input type="text" id="getnumber">
<input type="button" value="Get" onclick="getFunction()">
<p>Skriv ut Skiten:</p><div id="skit"></div>

Answer 1

这比您尝试做的要简单得多。您可以直接通过数字访问数组元素，而无需循环。只需从输入中获取i，然后输出rimm[i]。

var rimm = ["Hej", "Nej", "EJ", "Leverpastej", "42"];

function getFunction() {
    var i = document.getElementById("getnumber").value;
    document.getElementById("skit").textContent = rimm[i];
}

<input type="text" id="getnumber">
<input type="button" value="Get" onclick="getFunction()">
<p>Skriv ut Skiten:</p><div id="skit"></div>

您可能要添加一个检查数字是否有效并且在数组大小范围内。我把这个留给你。

注意：textContent比innerHTML更好，因为后者实际上是用于显示HTML编码的内容。除非您打算这样做，否则textContent是您的选择。

Answer 2

这是您可以采用的一种方法。我在用户输入中使用了事件处理程序和一些验证：

var words = ["Hej", "Nej", "EJ", "Leverpastej", "42"];

//Target our important elements
const userInputEl = document.querySelector('#userInput');
const outputEl = document.querySelector('#output');

//Fuction to validate the user input
const validateInput = input => {
  if (isNaN(input)) {
    outputEl.innerHTML = 'A number value is required!';
    return false;
  }

  if (input > (words.length - 1)) {
    outputEl.innerHTML = `The value must be between 0 and ${words.length - 1}`;
    return false;
  }

  return true;
};

//Add an event listener that will fire when the value in the text input is changed
userInputEl.addEventListener('change', e => {
  if (validateInput(e.target.value))
    outputEl.innerHTML = words[e.target.value];
});

<input id="userInput" type="text">
<div id="output"></div>

Answer 3

检查此小提琴：https://jsfiddle.net/85rbu79d

<input type="number" id="getnumber">
<input type="button" value="Get" onclick="getVal()">
<p>Skriv ut Skiten:</p><div id="skit"></div>
<script>
var rimm = ["Hej", "Nej", "EJ", "Leverpastej", "42"];

function getVal() {
    var input = document.getElementById('getnumber').value,
    val = rimm[input] || 'Not an option';

    document.getElementById('skit').innerHTML = 'Value from array: ' + val;

}

如何在用户输入中写入数组的编号并获取该特定数组编号的信息？

3 个答案: