javascript - 如何使用 ajax 发布一些内容然后检索它？

Question

正如你们所见，我是 javascript 和 jquery 的大菜鸟，但我对 ajax 请求有疑问。

这是我想做的，但我不知道怎么做:

• 我声明了一个 content.append('<div id="box"><textarea>some content</textarea></div');
• 现在我想做那个text = $('textarea').value();转到 ajax 请求。

像这样:

$.ajax({
    type: "POST",
    url: "/localstorage/boxes",
    data: text,
    contentType: "application/json; charset=utf-8",
    dataType: "json"
});

然后我想将该数据调用回另一个函数 oldBox()当用户点击该事件时显示它

更新

function saveNote(){

        var theNote = $('div#note');
        var textValue = $this.$('textarea').value();
        var textData = JSON.stringify(textValue);


        $.ajax ({
            type:"POST",
            url: "/localstorage/notes",
            data: textData,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(data) {
                loadNote(data);
            }
        });

    }

这很好，它修复了我的错误，但是当我尝试定位 localstorage/notes 文件时它是空的，它应该是空的吗？

Answer 1

在你的 ajax 中，添加这个位:

success: function(data) {
    oldBox(data);
}

所以你的 ajax 看起来像这样:

$.ajax({
    type: "POST",
    url: "/localstorage/boxes",
    data: text,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(data) {
        oldBox(data);
    }
});

这是假设您的 oldBox() 函数看起来与此类似:

function oldBox(data) {
    $('.whatever').html(data);
}

但是您也可以将这一行 ($('.whatever').html(data);) 添加到 success: 中。

在 /localstorage/boxes 中，您需要回显您想要的内容，以便 ajax 检索它。

例如:

text = "Hello";
// text -> /localstorage/boxes
/localstorage/boxes echoes out 'Hi to you to!'
// /localstorage/boxes -> original page
oldBox('Hi to you to!');