Javascript 用於循環迭代。 出了點問題

Question

我有名為data的對象列表。

和 1 個輸入標簽。

我想檢查數據的person1鍵中是否存在輸入值。 如果存在，我寫輸入值和person2鍵值。 否則寫I don't understand 。

這段代碼如何給出true答案。 這是wrong的。

試試How old are you 。 如果你輸入這個它必須給I don't understand 2 times and 30

 function SendMessage() { var input = document.getElementById('person'), sender = document.createElement('p'), receiver = sender.cloneNode(true), data = [{ "person1": "Hey", "person2": "Hey, How are you?" }, { "person1": "Hello", "person2": "Hello friend" }, { "person1": "How old are you", "person2": "30" }, ]; sender.innerText = input.value; document.body.appendChild(sender); for (var i = 0; i < data.length; i++) { if (input.value === data[i].person1) { receiver.innerText = data[i].person2; document.body.appendChild(receiver); i = data.length; } else { receiver.innerText = "I don't understand"; document.body.appendChild(receiver); } } }

 <input id="person"> <button onclick="SendMessage()">Send message</button>

Answer 1

我找到了我遺漏的代碼。 for 循環工作正常。 我在 for 循環之前創建元素。 每次迭代我只是更改元素 innerText。 寫I don't understand 。 但是當它找到正確答案時。 它會覆蓋答案。

 function SendMessage() { var input = document.getElementById('person'), sender = document.createElement('p'), receiver = sender.cloneNode(true), data = [{ "person1": "Hey", "person2": "Hey, How are you?" }, { "person1": "Hello", "person2": "Hello friend" }, { "person1": "How old are you", "person2": "30" }, ]; sender.innerText = input.value; document.body.appendChild(sender); for (var i = 0; i < data.length; i++) { if (input.value === data[i].person1) { receiver.innerText = data[i].person2; console.log(data[i].person2); document.body.appendChild(receiver); i = data.length; } else { console.log("I don't understand"); receiver.innerText = "I don't understand"; document.body.appendChild(receiver); } } }

 <input id="person"> <button onclick="SendMessage()">Send message</button>