在JS中分别显示循环数组项

时间:2019-10-21 22:02:13

标签: javascript arrays loops

这是一个待办事项列表。用户通过输入一项,然后按Enter键来制作一个。我希望在按下回车键后立即显示回车项目,但实际上发生的是所有(li)标签都与当前输入的键同时显示。

//    if button.exists {
//      button.tap()
//    } else if !button.exists {
//      sleep(10)
//      button.tap()
//
//    } else {
//      print("***************** Unable to find " + button.title + " *****************")
//    }

每个用户输入都存储在(li)标记中并单独显示。

2 个答案:

答案 0 :(得分:0)

for(let i = 0; i < lists.length; i++){
if (e.key === 'Enter') {
    if(lists[i].style.visibility == "visible") {
        continue;
    }
    lists[i].style.visibility = "visible";
    lists[i].style.fontSize = "16px";
    lists[i].textContent = textField.value;
    break;
}
}

答案 1 :(得分:0)

这只是使用计数器跟踪当前项目,因此无需每次都遍历所有内容。当然,这是非常基本的。

<figure>
  <img src="https://img2.androidappsapk.co/115/b/1/a/com.ludicside.mrsquare.png" alt="resource.Name"> </figure>
        var textField = document.querySelector("#inputField");
        var lists = document.querySelectorAll("li");
        var counter = 0;
        textField.addEventListener("keypress", function (e) {
                if (e.key === 'Enter' && counter < 6) {
                    lists[counter].textContent = textField.value;
                    textField.value = "";
                    counter++;
                }
        });