You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何将JavaScript获取的日期选择值传递给PHP并以JSON格式返回

实现方案

前端改造(修改你的setToSelected函数)

你已经在函数内拿到了完整的选中日期参数,只需要新增请求逻辑即可,修改后完整函数参考:

function setToSelected(me){
  const x = document.querySelector("span.active");
  if (x !== null) {
    x.classList.remove("active");
  }
  me.className='active';
  console.log(me.id);
  var dateselected=me.id.split('-')
  var day=dateselected[0].split('_')[0]
  var daynum=dateselected[0].split('_')[1]
  var month=dateselected[0].split('_')[2]
  switch(day){
    case 'lun':
      day='Lundi'
    break;
    // 你的其他星期转换逻辑
    default:
    console.log("erreur conversion day")
  }

  switch(month){
    case 'jan':
      month='Janvier'
    break;
    case 'fev':
      month='Fevrier'
    break;
    // 你的其他月份转换逻辑
    default:
    console.log("erreur conversion month")
  }
  document.getElementById("dateselected").innerHTML = "Selected restart date : "+day+" "+daynum+" "+month+" à "+dateselected[1]+"h";

  // ========== 新增请求逻辑开始 ==========
  // 1. 整理要传给后端的参数
  const submitData = {
    raw_id: me.id,
    day_name: day,
    day_num: daynum,
    month_name: month,
    hour: dateselected[1],
    display_text: document.getElementById("dateselected").innerText
  };
  // 2. 发送请求到PHP后端
  fetch('你的后端接口地址,比如./handle_date.php', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json'
    },
    body: JSON.stringify(submitData)
  })
  .then(res => res.json())
  .then(backResult => {
    // 这里处理后端返回的JSON结果,按需写业务逻辑即可
    console.log('后端返回结果:', backResult);
  })
  .catch(err => {
    console.error('请求失败:', err);
  });
  // ========== 新增请求逻辑结束 ==========
}

如果不需要选完日期就自动提交,只需要把上面新增的请求逻辑抽成单独的函数,绑定到提交按钮的点击事件上即可。

后端PHP实现(以handle_date.php为例)

<?php
// 设置返回格式为JSON
header('Content-Type: application/json; charset=utf-8');
// 前后端跨域的话可以加下面的配置,不需要可以删除
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: POST');
header('Access-Control-Allow-Headers: Content-Type');

// 接收前端传的JSON参数
$input = file_get_contents('php://input');
$dateInfo = json_decode($input, true);

// 业务逻辑处理(示例:参数校验+模拟处理)
$response = [];
if(empty($dateInfo['day_num']) || empty($dateInfo['month_name']) || empty($dateInfo['hour'])){
  $response = [
    'code' => 400,
    'msg' => '日期参数缺失',
    'data' => null
  ];
}else{
  // 这里写你自己的业务处理逻辑,比如存储到数据库、计算日期差等
  $response = [
    'code' => 200,
    'msg' => '处理成功',
    'data' => [
      'received_date' => $dateInfo['display_text'],
      // 其他你需要返回的字段
    ]
  ];
}

// 返回JSON格式结果
echo json_encode($response);
?>

注意事项

  • 优先传递原始可解析的日期参数给后端,不要仅传递展示用的自然语言文本,避免后端解析出错
  • 后端必须做参数合法性校验,不要直接使用前端传入的未校验参数
  • 也可以用XMLHttpRequest或者jQuery的$.ajax实现请求,核心逻辑和上述方案一致

内容的提问来源于stack exchange,提问作者Django

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.09.28 08:36:03