Question

您好，我是Jquery / ajax的新手，需要最终（我认为）代码的帮助。我有一个可拖动的项目（JQuery ui.draggable），当放置在放置区域时更新一个mysql表 - 这是有效的，用这个：

    function addlist(param)
{
    $.ajax({
    type: "POST",
    url: "ajax/addtocart.php",
    data: 'img='+encodeURIComponent(param),
    dataType: 'json',
    beforeSend: function(x){$('#ajax-loader').css('visibility','visible');}



    });
}

但我无法做到的是“重新加载”另一页/同一页面以显示更新的结果。简单来说，我想

拖动＆amp;降
更新数据库
显示加载gif
使用更新后的帖子（即来自拖放）

Answer 1

有很多方法可以做到这一点。我可能会做的是让PHP脚本输出需要显示的内容。这可以通过JSON（基本上是用JavaScript语法编码的数据）或通过原始HTML来完成。

如果您要使用原始HTML：

function addlist(param)
{
    $.ajax(
    {
        type: 'POST',
        url: 'ajax/addtocart.php',
        data: 'img=' + encodeURIComponent(param),
        dataType: 'html',
        beforeSend: function()
        {
            $('#ajax-loader').css('visibility','visible');
        },
        success: function(data, status)
        {
            // Process the returned HTML and append it to some part of the page.
            var elements = $(data);
            $('#some-element').append(elements);
        },
        error: function()
        {
            // Handle errors here.
        },
        complete: function()
        {
            // Hide the loading GIF.
        }
    });
}

如果使用JSON，该过程基本上是相同的，除非您必须自己在JavaScript中构造新的HTML元素（并且PHP脚本的输出必须使用json_encode进行编码，明显）。您的success回调可能如下所示：

function(data, status)
{
    // Get some properties from the JSON structure and build a list item.
    var item = $('<li />');
    $('<div id="div-1" />').text(data.foo).appendTo(item);
    $('<div id="div-2" />').text(data.bar).appendTo(item);

    // Append the item to some other element that already exists.
    $('#some-element').append(item);
}

Answer 2

我不知道PHP，但你想要的是addtocart.php来回馈某种响应（echo？）你会照顾的。

$.ajax({
type: "POST",
url: "ajax/addtocart.php",
data: 'img='+encodeURIComponent(param),
dataType: 'json',
beforeSend: function(x){$('#ajax-loader').css('visibility','visible');

success: function(response){ /* use the response to update your html*/} });

JQuery / ajax页面更新帮助请

2 个答案: