javascript - 如何使用 Ajax 提交成功后重新加载特定表单？

Question

我目前正在尝试重新加载特定表单，即提交按钮的表单，纯粹是为了即时反馈。我正在创建一个收藏夹按钮。这是我当前的设置。 ajax 可以工作，但我仍然需要重新加载页面才能显示新样式，甚至更改 METHOD 类型，这是取消收藏-收藏所必需的。

$.ajax({
    type: method,
    url: url,
    data: form.serialize(),
    success: function() {
        form.reload();
    }
});

Answer 1

我想你可以清除所有字段:

$.ajax({
    type: method,
    url: url,
    data: form.serialize(),
    success: function() {
        form.find('input:text, input:password, input:file, select, textarea').val('');
        form.find('input:radio, input:checkbox')
             .removeAttr('checked').removeAttr('selected');
    }
});

取自此answer .

编辑:

正如评论中所指出的，也许您应该让服务器从新创建的项目发回信息。

然后您可以填充您拥有的"template"，并用它替换表单:

var newItem = $("<div class='newItem'></div>");

$.ajax({
    type: method,
    url: url,
    data: form.serialize(),
    success: function( data ) {
        //Get response from server like : {'name':'Name', 'attribut':'Attribut'}
        for( var key in data ) {
            newItem.append("<p>" + key + " : " + data[key] + "</p>");
        }
        form.replaceWith(newItem);
    }
});

示例 JSFiddle .