Question

一段时间以来，我一直在研究AJAX教程，并制作了一个简单的待办应用程序，它使用JSON文件作为基本数据库。

但是，在添加新项目（执行POST请求）时，它将显示以下内容：

jquery.js:9600 POST http://127.0.0.1:5500/ajax/data/todo 405 (Method Not Allowed)

我的JS文件：

window.onload = function() {

let newTodo = document.querySelector("#new-todo").value;
let display = document.querySelector("#display");
let doneButton = document.querySelector("#newDone");

$.ajax({
    type: "GET",
    url: "data/todo.json",
    success: function(todo) {
        todo.forEach(item => {
            li = document.createElement("li");
            li.innerHTML = item.todo;
            display.appendChild(li);
        });
    },
    error: function() {
        alert("An error occurred!");
    }
});

doneButton.addEventListener("click", function() {

            let item = {
                todo: newTodo
            };

            newFunction(item, display);


});

} 

function newFunction(item, display) {
    $.ajax({
        type: "POST",
        url: "data/todo",
        data: item,
        success: function (todo) {
            todo.forEach(item => {
                li = document.createElement("li");
                li.innerHTML = item.todo;
                display.appendChild(li);
            });
        },
        error: function() {
            alert("An Error Occurred!");
        }
    });
}

还有HTML（如果需要）：

<!DOCTYPE html>
<html>
    <head>
        <title>AJAX</title>
        <style>/*
            #newDone {
               height: 40px;
                width: 60px;
            } */
        </style>
    </head>

  <body>
       <h1>TO-DO JS APP</h1>

       <span id = "new">Enter new todo: 
            <input type="text" id="new-todo" placeholder="NEW TODO"><button id="newDone">Done</button>
        </span>

        <ul id="display">

        </ul>
        <script src="jquery.js"></script>
        <script src="main.js"></script>
    </body>
</html>

我检查了文件的路径，这是正确的。有关如何解决此问题的任何想法？

不允许POST请求（纯客户端JavaScript）

0 个答案: