如何将home.php中Ajax请求结果加载到side.html的指定div中？

你的问题核心在于：side.html 通过 load 加载 home.php 时，home.php 里的动态内容是通过 Ajax 异步生成的，新请求的 home.php 不会自动执行之前的 Ajax 请求，自然拿不到目标内容。下面是几种可行的解决办法：

方法一：打开 side.html 时传递参数，让它自行请求数据 #

这种方法最直接，让 side.html 复用 display.php 接口，自己获取数据。

1. 修改 home.php 的按钮点击事件，把请求参数拼到 side.html 的 URL 上：

$(document).ready(function() {
  $("#btnApply").click(function() {
    // 把请求参数转为URL查询字符串
    const queryParams = new URLSearchParams({
      beginner: sel_beginner,
      marks: sel_marks,
      formID_Selected: formIdSelected,
      sel_topicID: topicIdSelected
    }).toString();
    // 带参数打开side.html
    window.open(`side.html?${queryParams}`);
  })
});

2. 修改 side.html 的代码，获取 URL 参数后发起 Ajax 请求：

$(document).ready(function () {  
  // 提取URL中的查询参数
  const urlParams = new URLSearchParams(window.location.search);
  const requestData = {
    beginner: urlParams.get('beginner'),
    marks: urlParams.get('marks'),
    formID_Selected: urlParams.get('formID_Selected'),
    sel_topicID: urlParams.get('sel_topicID')
  };

  // 直接调用display.php获取数据
  $.ajax({
    url: "display.php", 
    method: "POST", 
    data: requestData,   
    success:function(data){ 
      $("#questions").html(data);
    }
  });
});

方法二：通过窗口对象传递已获取的数据 #

如果 home.php 已经拿到了数据，可以直接把数据传递给新打开的 side.html 窗口。

1. 修改 home.php 的代码，暂存数据并传递给新窗口：

// 暂存Ajax请求的结果
let quizData = '';

// 原Ajax请求新增数据保存逻辑
$.ajax({
  url: "display.php", 
  method: "POST", 
  data:{ 
    beginner:sel_beginner,
    marks:sel_marks, 
    formID_Selected:formIdSelected, 
    sel_topicID:topicIdSelected
  },   
  success:function(data){ 
    $("#quizzes").html(data);
    quizData = data; // 保存数据
  }
});

// 按钮点击事件修改
$(document).ready(function() {
  $("#btnApply").click(function() {
    const sideWindow = window.open("side.html");
    // 监听新窗口加载完成，直接插入数据
    sideWindow.onload = function() {
      sideWindow.document.getElementById('questions').innerHTML = quizData;
    };
  })
});

2. side.html 只需确保存在 id="questions" 的 div 即可，无需额外请求代码。

方法三：用 localStorage 临时存储数据 #

通过浏览器的 localStorage 临时保存数据，side.html 读取后渲染。

1. 修改 home.php 的 Ajax 成功回调：

$.ajax({
  url: "display.php", 
  method: "POST", 
  data:{ 
    beginner:sel_beginner,
    marks:sel_marks, 
    formID_Selected:formIdSelected, 
    sel_topicID:topicIdSelected
  },   
  success:function(data){ 
    $("#quizzes").html(data);
    // 把数据存入localStorage
    localStorage.setItem('quizData', data);
  }
});

2. 修改 side.html 的代码：

$(document).ready(function () {  
  // 读取localStorage中的数据
  const quizData = localStorage.getItem('quizData');
  if(quizData) {
    $("#questions").html(quizData);
    // 用完删除数据，避免残留
    localStorage.removeItem('quizData');
  }
});

注意：如果数据包含敏感信息，不建议使用 localStorage，优先选择方法一或方法二。

内容的提问来源于stack exchange，提问作者JohnKibika