jquery - jQuery发布，然后立即在同一页面上显示发布的数据

如何使用ajax发布数据并在同一页面的div中显示发布的数据而无需刷新页面？

最佳答案

为此，您不应该提交表单，而应通过click事件捕获表单数据，通过AJAX提交数据，最后……将数据输入DIV元素。例如。

jQuery的

$("#submitdata").click(function() {
  var FormVal={ datafield1:$('#field1').val(),
                datafield2:$('#field2').val()};

  $.ajax({
    type: "POST",
    url: "myupdatepage.cfm",
    dataType: "json",
    data: FormVal,
    async: false,
    success: function(response) {
               $('#fillmein').html($('#field1').val()+'<br />'+$('#field1').val()); // Assign the values to the DIV
             }
  });
});

的HTML

<form action="">
  <input type="text" id="field1">
  <input type="text" id="field2">

  <input type="button" id="submitdata" value="Submit data" />
</form>

<div id="fillmein"></div>