使用JQuery轻松保存到JSON文件

小编典典

使用JQuery轻松保存到JSON文件

ajax

我已经尝试了所有可以使用的示例，但不能简单地将JSON数据保存到主机上的JSON文件中。我想从一个尽可能简单的保存方法开始，所以我有一个起点。

这就是我得到的： 基本上，我的 index.html中
有一个按钮，单击后应将数据保存到我的general.json文件中（与index.html相同的位置）。

<button id="savebtn">Save</button>

使用 myscript.js中的 id选择器，我可以这样做：

$('#savebtn').click(function() {
                var saveit = $('#calendar').fullCalendar( 'clientEvents');

        var eventsholded = [];

    $.each(saveit, function(index,value) {
        var event = new Object();
        event.id = value.id;            
        event.start = value.start;
        event.end = value.end;
        event.title = value.title;
    event.allDay = value.allDay
        eventsholded.push(event);
    }); 
    $.ajax
    ({
        type: "GET",
        dataType : 'json',
        async: false,
        url: 'general.json',
        data: JSON.stringify(eventsholded),
        success: function () {alert("Thanks!"); },
        failure: function() {alert("Error!");}
    });

如您所见，我想存储fullcalendar中的事件。这不是很相关，因为到现在为止它仍然可以正常工作。
如果我在屏幕上发出JSON.stringify（eventsholded）警报， 您将看到以下内容：

[{"start":"2014-01-07T08:30:00.000Z","end":"2014-01-07T12:30:00.000Z","title":"Pumukli Pista","allDay":false},{"start":"2014-01-11T13:30:00.000Z","end":"2014-01-11T18:30:00.000Z","title":"Fanic Catalin","allDay":false}]

现在， 这正是我想要以简单，快速，也许不安全但非常简单的方式保存到服务器的内容。
这样我就可以开始理解它是如何工作的，只是将其包含在我的general.json文件中。

该$.ajax部分在我上面的代码中不执行任何操作。甚至没有警告“错误”。其余代码按预期工作。

安全性现在不重要。 我只想了解它是如何工作的。

对于包含完整示例的任何帮助或有用链接，我将不胜感激。谢谢！

阅读 1331

2020-07-26

共1个答案

小编典典

$.ajax单独不会保存json文件，您需要将url属性定向到服务器端脚本，即http://your.host/save_json.php，它将在其中创建general.json并写入您的输出。就像是：

PHP：

<?php
$myFile = "general.json";
$fh = fopen($myFile, 'w') or die("can't open file");
$stringData = $_GET["data"];
fwrite($fh, $stringData);
fclose($fh)
?>

您还需要更改调用中的data属性，以为GET变量提供一个可以从PHP检索的适当名称：ajax``data: {data: JSON.stringify(eventsholded)}

JQUERY

$.ajax
    ({
        type: "GET",
        dataType : 'json',
        async: false,
        url: 'http://your.host/save_json.php',
        data: { data: JSON.stringify(eventsholded) },
        success: function () {alert("Thanks!"); },
        failure: function() {alert("Error!");}
    });

2020-07-26