首页 > 解决方案 > POST 加载时显示 JAVASCRIPT 的问题

问题描述

我使用以下代码来选择数据以显示给用户,而无需移动到另一个页面。

<script type="text/javascript">
$(document).ready(function() {
  $('#testform input[name=date]').datepicker({
    autoHide: true
  });
  $('#testform').submit(send);
});

function send() {
  const data = $(this).serialize();
  $('#output').text("FormData: " + data);
  $.ajax({
    type: "POST",
    url: "receiving_file.php",
    data,
    success: function(data) {
  document.getElementById("PrintData").outerHTML = data;
  document.getElementById("PrintImg").src = data;
    }
  });
  return false;
}
</script>

为了在不转到其他页面的情况下显示输出,我在代码中编写:

<p id="PrintData">

文件接收文件.php 中的代码如下所示:

<?php
$date = $_POST['date'];
print $date;
?>

问题是我想在传入的数据中使用 JavaScript,但它不起作用。但是,当我尝试在浏览器中查看源代码时,我看不到数据。

有谁知道如何解决这个问题?

谢谢

标签: javascriptphphtml

解决方案


您需要阻止默认提交行为,否则您的表单将继续正常提交,并且您不会看到 ajax 部分完成。

function send(e) {
    e.preventDefault(); // prevent native submission
    // ... rest of your code as before
}

我对您的示例进行了一些修改,以使其在此 jsFiddle中工作。您不需要所有这些更改,但是在 jsFiddle 中模拟 Ajax 请求时,您必须发布您希望在响应中看到的 html。


推荐阅读