Question

大家好我正在尝试在我的多步骤表单中加入jQuery AJAX，以便它将某个div更新为process.php页面上的div，但它会不断将结果加载到新页面上。如何在不刷新页面的情况下更新div？

这是我正在使用的jQuery代码：

$.ajax({
    url: 'process.php',
    data: $('form[name="booking"]').serialize(),
    dataType: 'html',
    type: 'POST',
    success: function(data) {

        // this is the bit that needs to update the div

        $('#last-step').fadeOut(300, function() { $('#result').html(data).fadeIn(300);
    },
    complete: function (data) {
        // your code here
    },
    error: function (url, XMLHttpRequest, textStatus, errorThrown) {
        alert("Error: " + errorThrown);
    }
});

这是我的多步骤表单的代码：http://jsfiddle.net/xSkgH/47/。

非常感谢提前

Answer 1

我在你的标记中看不到名为result的div。因此，您可能需要在显示的最后一个div中显示结果。你也错过了})。以下代码应该有效，

$.ajax({
    url: 'process.php',
    data: $('form[name="booking"]').serialize(),
    dataType: 'html',
    type: 'POST',
    success: function(data) {

        // this is the bit that needs to update the div

        $('#last-step').fadeOut(300, function() { 
              $('#last-step').html(data).fadeIn(300);
        });
    },
    complete: function (data) {
        // your code here
    },
    error: function (url, XMLHttpRequest, textStatus, errorThrown) {
        alert("Error: " + errorThrown);
    }
});

多步形式的jQuery ajax

1 个答案: