使用AJAX点击按钮更新PHP日历及关联updateCal函数问题咨询

问题1：关联updateCal()函数与jQuery就绪代码块 #

首先你现有代码存在一个基础错误：jQuery选择器$("moveCal")无效，元素选择需要指定类（前缀.）、ID（前缀#）或者标签名，否则无法匹配到对应元素。

关联两种方式可以选择：

方案1：保留现有内联onclick写法 #

直接把updateCal定义为全局函数即可，同时要把切换的月份参数传给后端接口：

// 全局函数直接定义在script标签内，不需要嵌套在ready块里就可以被内联onclick调用
function updateCal(monthStr) {
    // 把月份参数通过query参数传给后端
    $("#calendar").load("/presentation/cal.php?target_month=" + monthStr);
}

$(document).ready(function(){
    // 如果要把updateCal定义在ready块内，只需额外加一行挂载到window对象即可
    // window.updateCal = updateCal;
});

后端cal.php直接读取$_GET['target_month']解析月份，渲染对应日历内容返回即可。

方案2：移除内联onclick，用jQuery统一绑定（更推荐，逻辑视图分离） #

先修改PHP输出代码，把月份参数存在自定义属性里，加上统一的类名：

echo '<span class="moveCal" data-month="'.$toMonth->format('mY').'">';
echo '<span class="calendar_month_link">   '.$toMonth->format('M').' &gt</span></span>';

然后修改jQuery代码，直接在ready块内完成事件绑定，不需要单独写updateCal函数：

$(document).ready(function(){
    // 类选择器匹配所有切换按钮
    $(".moveCal").click(function(){
        // 读取当前点击按钮存储的月份参数
        const targetMonth = $(this).data('month');
        $("#calendar").load("/presentation/cal.php?target_month=" + targetMonth);
    });
});

问题2：无Session时的请求隔离问题 #

• 服务器不会默认按IP隔离或者共享请求结果，所有HTTP请求都是独立的，每个请求携带的月份参数是各自独立的，后端只需根据当前请求传入的月份参数返回对应渲染结果即可。
• 不同用户同时访问时，各自点击切换按钮会传自己选中的月份参数，各自拿到对应的日历内容，完全不会互相影响，不需要依赖Session、Cookie就能实现多用户独立切换日期。只要你后端没有把单用户的查询结果做全局复用的缓存，就不会出现不同用户串数据的情况。

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