Попытка сделать словарь в JavaScript, используя массив и объекты - PullRequest
Новая
       3

Попытка сделать словарь в JavaScript, используя массив и объекты

0 голосов
/ 27 августа 2018

Сегодня я пытался сделать Попытка сделать словарь в JavaScript с использованием массива и объектов

Я пытаюсь сделать поиск здесь, используя подсказку 

<html>

<body style="font-size: 40px">
  <input type="text" id="myin">
  <button id="btn">Search</button>
  <div id="outputArea"></div>

  <script>
    var outputAreaRef = document.getElementById("outputArea");
    var output = "";
    var word = prompt("Enter something: ");

    var acronyms = [{
        acronym: "omg",
        meaning: "Oh MY God"
      },
      {
        acronym: "lol",
        meaning: "Laugh Out Loud"
      },
      {
        acronym: "lmao",
        meaning: "Laughing My Age Off"
      },
      {
        acronym: "wtf",
        meaning: "What This Function"
      }
    ];
    for (var i = 0; i < acronyms.length; i++) {
      if (acronyms[i].acronym === word) {
        word = acronyms[i].meaning;

        outputAreaRef.innerHTML = word;
      }
    }
  </script>
</body>

</html>

Но при попытке использовать элемент ввода с функцией кнопки onclick, а не подсказку, он вообще не работает

вот код с входом и кнопкой 

<html>

<body style="font-size: 40px">
  <input type="text" id="myin">
  <button id="btn">Search</button>
  <div id="outputArea"></div>

  <script>
    var outputAreaRef = document.getElementById("outputArea");
    var output = "";
    var word = document.getElementById("myin");

    var acronyms = [{
        acronym: "omg",
        meaning: "Oh MY God"
      },
      {
        acronym: "lol",
        meaning: "Laugh Out Loud"
      },
      {
        acronym: "lmao",
        meaning: "Laughing My Age Off"
      },
      {
        acronym: "wtf",
        meaning: "What This Function"
      }
    ];
    for (var i = 0; i < acronyms.length; i++) {
      if (acronyms[i].acronym === word) {
        word = acronyms[i].meaning;

        document.getElementById('btn').onclick = function() {
          outputAreaRef.innerHTML = word;
        }
      }


    }
  </script>
</body>

</html>

Пожалуйста, помогите, где это не так

Извините за мой плохой АНГЛИЙСКИЙ,

Ответы [ 2 ]

0 голосов
/ 27 августа 2018

Вам необходимо получить значение ввода с помощью document.getElementById("myin").value. Во-вторых, создать function и прикрепить его с помощью обработчика нажатия кнопки.

Внутри этого обработчика события получите значение input, извлекая значение вне обработчика щелчка, работать не будет. 

var outputAreaRef = document.getElementById("outputArea");
var output = "";


var acronyms = [{
    acronym: "omg",
    meaning: "Oh MY God"
  },
  {
    acronym: "lol",
    meaning: "Laugh Out Loud"
  },
  {
    acronym: "lmao",
    meaning: "Laughing My Age Off"
  },
  {
    acronym: "wtf",
    meaning: "What This Function"
  }
];

//Attach event listener to the button

document.getElementById('btn').addEventListener('click', searchWord)

function searchWord() {
  // need to get the value of the input
  var word = document.getElementById("myin").value;
  // if matches then show the value
  for (var i = 0; i < acronyms.length; i++) {
    // to lowerCase to make it case insensitive & trim to remove white space
    if (acronyms[i].acronym === word.toLowerCase().trim()) {
      outputAreaRef.innerHTML = acronyms[i].meaning;
    }
  }
}
body {
  font-size: 40px;
}
<input type="text" id="myin">
<button id="btn">Search</button>
<div id="outputArea"></div>
0 голосов
/ 27 августа 2018

Ваш код выполняется сразу же, и слово еще не будет установлено. Следовательно, ничего не происходит. Вы должны переместить всю логику поиска (получение текущего ввода и проверка словаря) в обратный вызов onclick.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...