Введенный номер не выбирают карту

Question

Итак, я строю эту колоду карт, но когда я набираю число в текстовой области в HTML, она не возвращает карту из массива 'hjerter'. Предполагается, что нужно выбрать число из числа, которое имеет был введен в текстовое поле HTML, а затем отобразить данную карту на странице HTML.

function visKort() {
  var x = document.getElementById("Nr").value;
  var hjerter = ['h-ace', 'h2', 'h3', 'h4', 'h5', 'h6', 'h7', 'h8', 'h9', 'h10', 'h-jack', 'h-queen', 'h-king'];

  var kort = "";
  var i;
  for (i = 0; i < hjerter.length; i++) {
    if (x == hjerter[i]) {

    } else if (i > 0) {
      break;
    }
    kort += "Nr " + x + "<br>" + "Dit kort er " + hjerter[i];
  }
  document.getElementById("vis_kort").innerHTML = kort;
}

<center>
  <main>
    <h1>Kortspil til opgave 2</h1>
    <h2>Indtast nr på kort<br></h2>
    <textarea id="Nr">
        </textarea>
    <p></p>
    <button type="button" onclick="visKort()">Vis mit kort</button> <br>
    <p id="vis_kort"><br>
  </main>
</center>

Answer 1

Как написано ваше l oop, оно всегда добавляет первую карту, а затем разбивается на вторую карту. Вам нужно сравнить x (выбранное число) с i (указатель в колоде) и установить текст, только если они совпадают. Однако это несколько избыточно - вы можете просто получить доступ к колоде, используя x напрямую. Смотрите ниже:

function visKort() {
  var x = Number(document.getElementById("Nr").value);
  var hjerter = ['h-ace', 'h2', 'h3', 'h4', 'h5', 'h6', 'h7', 'h8', 'h9', 'h10', 'h-jack', 'h-queen', 'h-king'];

  document.getElementById("vis_kort").innerHTML = "Nr " + x + "<br>" + "Dit kort er " + hjerter[x-1];
}

<center>
  <main>
    <h1>Kortspil til opgave 2</h1>
    <h2>Indtast nr på kort<br></h2>
    <textarea id="Nr">
        </textarea>
    <p></p>
    <button type="button" onclick="visKort()">Vis mit kort</button> <br>
    <p id="vis_kort"><br>
  </main>
</center>