如何使用Ajax将同一数据传递至多个JSP页面？

先看你现有的代码：

$(document).ready(function () {
  $("#year").on("change", function () {
    var year_id = $("#year").val();
    $.ajax({
      url: "month.jsp",
      data: {year_id: year_id},
      method: "POST",//HTTP method.
      success: function (data) {
        $("#month_id").html(data);
      }
    });
  });
});

你现在需要在#year值改变时，把同一个year_id同时发送给另一个JSP页面，这里有几种实用的实现方式：

方式一：发起两个独立的Ajax请求 #

最直接的方式就是在同一个change事件处理函数里，写两个$.ajax调用，分别指向不同的JSP页面，传递相同的year_id：

$(document).ready(function () {
  $("#year").on("change", function () {
    var year_id = $("#year").val();
    
    // 第一个请求：发给month.jsp
    $.ajax({
      url: "month.jsp",
      data: {year_id: year_id},
      method: "POST",
      success: function (data) {
        $("#month_id").html(data);
      }
    });
    
    // 第二个请求：发给另一个JSP页面，比如other.jsp
    $.ajax({
      url: "other.jsp",
      data: {year_id: year_id},
      method: "POST",
      success: function (data) {
        // 这里可以处理第二个请求的返回结果，比如控制台打印或者更新页面其他元素
        console.log("另一个JSP返回的数据：", data);
      },
      error: function (xhr) {
        console.error("请求另一个JSP失败：", xhr);
      }
    });
  });
});

这种方式简单易懂，不需要额外封装，适合快速实现需求；缺点是如果后续要增加更多请求，代码会变得冗余。

方式二：封装通用请求函数，减少重复代码 #

如果后续可能需要向更多页面发送数据，建议把请求逻辑封装成一个函数，这样代码更易维护：

$(document).ready(function () {
  // 封装通用的发送year_id函数
  function sendYearData(targetUrl, successCallback) {
    var year_id = $("#year").val();
    $.ajax({
      url: targetUrl,
      data: {year_id: year_id},
      method: "POST",
      success: successCallback || function() {},
      error: function (xhr) {
        console.error(`请求${targetUrl}失败：`, xhr);
      }
    });
  }

  $("#year").on("change", function () {
    // 发送给month.jsp，并处理返回结果
    sendYearData("month.jsp", function(data) {
      $("#month_id").html(data);
    });
    
    // 发送给另一个JSP页面
    sendYearData("other.jsp", function(data) {
      console.log("另一个JSP返回的数据：", data);
    });
  });
});

这样的写法更简洁，后续要新增请求只需要调用sendYearData即可，维护成本更低。

方式三：后端转发（如果允许调整后端代码） #

如果你的后端可以配合修改，也可以只发送一次请求到month.jsp，然后在month.jsp的后端代码中，把year_id转发给另一个JSP页面，这样前端只需要发起一次请求，减少网络开销：

比如在month.jsp的Java代码中：

<%
String yearId = request.getParameter("year_id");
// 处理month.jsp自身的逻辑...

// 转发请求到另一个JSP，比如other.jsp
RequestDispatcher dispatcher = request.getRequestDispatcher("other.jsp");
dispatcher.forward(request, response);
%>

这种方式适合不需要前端处理两个请求返回结果的场景，前端只需要关注month.jsp的响应即可。

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