javascript - Ajax:发布动态的Ajax内容

我正在尝试将div的内容写入新的html文件。 div的内容是由ajax本身生成的，因此，当我尝试将内容发布到新文件时，所有写入该文件的内容都是原始html。有没有办法写“ ajaxed in”内容的div内容？

这是我的ajax代码：

$("#getSource").on('click', function(){

  headerURL = $(".header-code").attr('data-url');
  $.ajax({
    url: headerURL,
    data: "function=showCode",
    success: function(data){
      $('code #mainCode').append(data);
    }
  });

  var bufferId =$("#mainCode").html();
  $.ajax({
     type : "POST",
     url : "postCode.php",
     data: {id : bufferId},
     dataType: "html",
     success: function(data){
       alert("ok");
     }
  });
});

我的php代码：

$handle = fopen("test.html", 'w+');
$data = $_POST['id'];
if($handle) {
    if(!fwrite($handle, $data )) {
        echo "ok";
    }
}

用test.html编写内容的最终结果：

<div id="mainCode"></div>

当我真的需要：

<div id="mainCode">
  [dynamic content that is added by the user via ajax]
</div>

最佳答案

您还可以使用$ .ajax返回的延迟对象在第一个请求之后运行第二个ajax请求：

headerURL = $(".header-code").attr('data-url');
$.ajax({
    url: headerURL,
    data: "function=showCode",
    success: function(data){
      $('code #mainCode').append(data);
    }
}).done(
  function() {
    var bufferId =$("#mainCode").html();
    $.ajax({
       type : "POST",
       url : "postCode.php",
       data: {id : bufferId},
       dataType: "html",
       success: function(data){
         alert("ok");
       }
    });
  }
)