在使用提示请求用户输入之前加载 HTML。



我想在使用提示()询问用户输入之前加载html。仅当我退出提示时,HTML才会加载。请查看我的代码。

我尝试在HTML主体代码末尾链接JavaScript,但在提示中要求输入之前,HTML代码仍未加载。

这是html代码: -

<!DOCTYPE html>
<html>
<head>
    <title>Todo</title>
    <script type="text/javascript" src="third.js"></script>
</head>
<body>
    <h1>Todo List</h1>
    <ul>
        <li>new - To add new Todo</li>
        <li>list - To list all Todo on Console</li>
        <li>quit - To quit the Todo App</li>
        <li>delete - To remove an item from Todo App</li>
    </ul>
</body>
</html>

这是JavaScript代码: -

var ansa = [];
var ans = prompt("What would you Like to do??");
while(ans !== "quit"){
    if(ans === "new"){
        addTodo();
    } else if (ans === "list") {
        listTodo();
    } else if (ans === "delete") {
        deleteTodo();
    };
    var ans = prompt("What would you Like to do??");
}
alert("Visit Agaain!!");
function addTodo () {
    var newTodo = prompt("Enter a new Todo!!!")
    ansa.push(newTodo);
    console.log(newTodo + " is added to the Todo")
}
function listTodo () {
    // console.log(ansa);
    console.log("***********");
    ansa.forEach(function (item) {
        console.log(ansa.indexOf(item) + ": " + item)
        // console.log(index + ": " + item)
    })
    console.log("***********");
}
function deleteTodo () {
    var index = prompt("Which index would like to delete")
    ansa.splice(index, 1);
    console.log("Todo Item deleted")
}

即使您在window.onload回调中运行代码,它也行不通。由于某种原因,这就是浏览器的工作方式。

如果我没有错,它可以正常工作,因为您只会在Internet Explorer上进行。

在这种情况下,我一直使用的解决方法是添加短时间:

setTimeout(function () {
  // your code
}, 200)

使用settimeout并添加延迟,请检查以下代码!

var ansa = [];
var delayInMilliseconds = 1000; //1 second
setTimeout(function() {
  var ans = prompt("What would you Like to do??");
while(ans !== "quit"){
    if(ans === "new"){
        addTodo();
    } else if (ans === "list") {
        listTodo();
    } else if (ans === "delete") {
        deleteTodo();
    };
    var ans = prompt("What would you Like to do??");
}
alert("Visit Agaain!!");
}, delayInMilliseconds);

function addTodo () {
    var newTodo = prompt("Enter a new Todo!!!")
    ansa.push(newTodo);
    console.log(newTodo + " is added to the Todo")
}
function listTodo () {
    // console.log(ansa);
    console.log("***********");
    ansa.forEach(function (item) {
        console.log(ansa.indexOf(item) + ": " + item)
        // console.log(index + ": " + item)
    })
    console.log("***********");
}
function deleteTodo () {
    var index = prompt("Which index would like to delete")
    ansa.splice(index, 1);
    console.log("Todo Item deleted")
}

最新更新