Question

我正在建立一个网站，其中有一个用户可以添加内容的页面，他们可以将div重新排列到他们想要的任何位置和大小。我想要一个保存按钮，保存每个div的当前位置;但是，我不希望每次刷新页面（我也将进行自动保存，这将需要在后台保存信息）。

我无法弄清楚如何将数据发布到服务器，而不会导致页面重新加载。我想我需要某种AJAX请求，但找不到任何告诉我如何做的事情（我能找到的所有AJAX示例似乎都是关于从服务器读取数据）。我想我现在才刚开始转圈，但我根本无法理解这一点 - 我知道这可能不是一件难事，但我不断对不同的例子感到困惑。

所以，首先，这是最好的方法吗？如果是这样，有人能指出我通过AJAX发布数据的简单例子吗？我已经在使用jQuery了，所以也可以将它用于Ajax。

感谢。

Answer 1

使用jQuery的超简单AJAX：

$.ajax({
    url: '/save-the-stuff-url',
    type: 'POST',
    data: {
        // information about your divs, etc.
        'foo' : 'bar'
    },
    success: function(response) {
        // if the AJAX call completes successfully, this function will get called.
        alert('POST successful!');
    }
});

试一试！

Answer 2

在这里，尝试使用AJAX：

$.post("example.php", {
        from : "ajax", // put some info in these - they are the params
        time : "2pm",
        data : "save"
    },
    function(data) { // callback function - data always passed to it
        $("#success").html(data); // do something with that data
    }
);

把它放在某个地方：

<span id='success'></span>

然后，尝试示例.php：

<?php
    if(isset($_POST['from']) and $_POST['from'] == 'ajax'){
        echo "<span style='color: green;'>Saved!</span>";
    }
    else {
        echo "<span style='color: red;'>Failure!</span>";
    }
?>

然后只需修改它们以满足您的需求，可能会更改目标文件。无论脚本输出是什么，都给予ajax请求。这意味着如果这是我的PHP脚本：

<?php echo "Aloha!"; ?>

这是我的javascript：

$("#output").load("myScript.php");

然后#output会有“Aloha!”。

希望这有帮助！

Answer 3

请查看Jquery site的各种帖子示例。

HTH

Answer 4

和jQuery文档页面是学习jQuery的好方法..帖子的页面是http://docs.jquery.com/Post

如果你还没有使用它，你可能还想看看jQuery draggables。

http://docs.jquery.com/UI/API/1.8/Draggable

你可以用

轻松放开与你的可拖动物体相关的豁免

$( ".selector" ).draggable({
   stop: function(event, ui) { ... }
});

在幕后将数据发布到服务器

4 个答案: