使用ajax根据传递给按钮的值更新div

Question

我正在使用php显示日历服务器端。现在我想用两个按钮滚动月份(<</>>)而无需重新加载整个页面。有很多问题和例子，我发现一些非常接近的形式，然而，我还没有真正理解如何适应一个按钮。

传递请求新数据的一个非常简单的脚本是

<script>
$(document).ready(function(){
$("moveCal").click(function(){
$("#calendar").load("/presentation/cal.php");
});
});
</script>

先前php请求另一个月的尝试看起来像这样

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

但是如何将updateCal()函数与$(document).ready(function(){连接起来呢?

另一件我有点困惑的事情是:如果我没有使用存储在cookie中的会话id，应用服务器仍然只提供带有请求日期的请求IP，对吗?其他同步用户可以选择要显示的其他日期吗?

Answer 1

您可能想要更多细节，但这里是要点:

用户访问一个网页，地址指向一个PHP文件——PHP文件在服务器上运行。它对每个请求运行一次，因此输出将只提供给请求者。如果文件是静态的，或者它总是产生相同的HTML输出，那么它对每个人来说都是一样的。

在您的情况下，听起来您至少需要一个month变量，也可能需要一个year变量。当请求带有变量(如$('#calendar').load('/presentation/cal.php?month=10&year=2021'))时，您可以使用变量值来更改输出。由于变量来自请求，因此输出将特定于传递的变量—因此站点上的每个用户都可以发送不同的请求，并且都看到唯一的输出。

在上面的例子中，月和年是通过GET传递的(即它们被附加到URL中，而不是在表单中或通过POST AJAX传递，如$.post('cal.php', {month: 10, year: 2021}, function(responseData) { /*...*/ });)。

PHP反过来有$_GET和$_POST数组分别保存通过GET和POST方法传递的参数。因此，在请求的PHP文件(cal.php)中，可以使用$_GET['month']和$_GET['year']来访问请求的月份和年份。您需要检查请求中是否存在它们，如果不存在，则使用默认值。如果它们在请求中，您将需要验证它们是否是合法值，如果不是，则诉诸默认值(或向用户传递错误消息)。

所以伪代码可能看起来像这样:

cal.php

<?php
$defaultMonth = date("n");
$defaultYear = date("Y");
$month = isset($_GET['month']) ? $_GET['month'] : $defaultMonth;
/* check that $month is 1 - 12 [or whatever format you're expecting] and if not, set it to $defaultMonth instead, same thing for year */
$year = isset($_GET['year']) ? $_GET['year'] : $defaultYear;
/* query your database for events occurring in month $month and year $year */
/* echo out your calendar HTML with the included events from the requested month/year */
?>

index . php:

<div id='calendar'></div>
<script src='/path/to/jquery.js'></script>
<script>
var defaultMonth = <?php echo date("n") ?>;
var defaultYear = <?php echo date("Y") ?>;

var currentMonth = defaultMonth;
var currentYear = defaultYear;

function UpdateCal() {
$('#calendar').load('cal.php?month=' + currentMonth + '&year=' + currentYear);
}

function NextMonth() {
currentMonth += 1;
if(currentMonth == 13) {
currentMonth = 1;
currentYear += 1;
}
UpdateCal();
}

function PrevMonth() {
currentMonth -= 1;
if(currentMonth == 0) {
currentMonth = 12;
currentYear -= 1;
}
UpdateCal();
}

</script>