使用 Ajax 修改并保存 JSON 文件中的数据

首先这是我的.json file:

{           
    "ids": [1,2],
    "names": ["John Richards", "Doe Williams"],                     
    "skills": [ "Senior Software Engineer", "Junior Software Developer"]

}

这是我的 ajax 调用，用于显示对象中的每个名称。

$.ajax({ 
    dataType: "json",
    url: "entries.json",
    success: function(data){
        for (var i = 0; i < data.names.length; i++){
            console.log(data.names[i]);
        }
    }
});

我有一个包含 3 个字段和一个按钮的表单，我用它来提交新数据。问题是我无法修改该 json 文件并提交该数据。

$("#add").on("click",function(){
                var url = "entries.json";   

                //Form input
                var id = $("#empID").val();
                var fullName = $("#empFullName").val();
                var prof = $("#empProf").val();

                var entry = {   "ids":id, 
                                "names":fullName, 
                                "skills":prof 
                            };
                ....
                Ajax call for modification of the json file?!?!

我所说的修改基本上是插入id, fullName and prof到json的相应字段中并save它具有新的价值观appended。有什么见解吗？我被困住了。拉着就好了。如何将数据推送到 .json 文件？如果我错过提供任何重要的信息，请告诉我。我对 ajax 的工作还比较陌生。

提前致谢！

P.S：如果有人想知道的话，我已经使用数据库制作了该项目。

您无法在浏览器中仅使用 JavaScript 写入 JSON 文件。但是通过浏览器中的 JavaScript，您可以编写文档.cookie https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie并且还写在窗口本地存储 https://developer.mozilla.org/en/docs/Web/API/Window/localStorage.

在浏览器的localStorage中写入：

// Form input
var id = $("#empID").val();
var fullName = $("#empFullName").val();
var prof = $("#empProf").val();

var obj = {
    "ids": id,
    "names": fullName,
    "skills": prof
};
localStorage.setItem('myJavaScriptObject', JSON.stringify(obj));

与从 localStorage 检索对象相比，您可以执行以下操作：

var obj = JSON.parse(localStorage.getItem('myJavaScriptObject'))

您可以做的其他事情是使用服务器端技术（例如：NodeJS、Ruby on Rails、PHP、JAVA 等）在后端创建一个服务，以处理 JSON 文件中的写入数据。

• 然后从浏览器中制作一个POST将表单输入数据发送到服务端点的请求，数据可以保存到 JSON 文件中。

希望这能有所帮助。