php - 不同日期有不同数据

Question

我正在制作一个网页，允许用户输入和查看不同日期的数据，并更改日期，有两个按钮，其中一个将显示前一天，一个将显示第二天。我知道我可以通过提交表单并在每次按下这些按钮之一时重新加载页面来做到这一点，但我宁愿使用 javascript 而不必提交表单，但我在让它工作时遇到了麻烦。目前，我有两个按钮，并且日期存储在 PHP 变量中，如下面的代码所示:

<script>
function init() {
    <? $nutrDate = $this->parseDate(date('m/d/Y')); ?>
}
function nutrPrevDay() {    
    <? $nutrDate = mktime(0, 0, 0, date('m',$nutrDate), date('d',$nutrDate)-1, date('Y',$nutrDate)); ?>
    alert("<? echo(date("m/d/y", $nutrDate)) ?>");
}
function nutrNextDay() {
    <? $nutrDate = mktime(0, 0, 0, date('m',$nutrDate), date('d',$nutrDate)+1, date('Y',$nutrDate)); ?>
}
window.onload = init;
</script>

<p style="text-align:center; font-size:14px; color:#03F">
  <button onclick="nutrPrevDay()" style="width:200px" >< Show Previous Day</button>                 
  <? echo(date('m/d/Y', $nutrDate)) ?>          
  <button onclick="nutrNextDay()" style="width:200px">Show Next Day ></button>  
</p>

我在 nutrPrevDay() 中收到警报仅用于调试。发生的情况是，当我单击按钮时，警报显示日期已正确减少(例如从 5 月 17 日到 5 月 16 日)，但仅减少一天，而不是每次点击减少一天。另外，我不知道如何使页面上的文本(由行创建)更改以在单击按钮后显示新日期。

这是我的问题:1) 是否可以使用 javascript 动态更改页面上的数据(例如文本，以及将来的 SQL 查询)，而无需在单击按钮时重新加载页面？2)如果可能的话，我该如何进行这些更改？3)如何解决这个问题，以便每次单击按钮时它都会增加和减少日期？

Answer 1

第一季度:

是的，有可能， AJAX 可能就是您正在寻找的。

第二季度:

首先，您必须了解 JavaScript 在客户端工作，而 PHP 在服务器端工作。考虑到这一点，您不能仅仅因为在 javascript 函数中编写了 php 脚本，就期望在单击按钮时执行 php 脚本。

您最多可以将 PHP 脚本中的内容打印到 JavaScript 脚本中。除了警报部分之外，您的脚本在这方面失败了。示例:

<script>
function javascriptFunction(){
  // This php script, will be executed when you call your page, however $nutrDate is an assigned php variable, javascript will never know about it;
  <?php $foo = 'bar'; ?>
  // This will give you a javascript error because $foo is a string
  var foo = <?php echo $foo; ?>;
  // This is the code which will do the expected, notice the quotes.
  var foo = '<?php echo $foo; ?>';

  // If you have a single quote inside $foo, it will break javascript
  <?php $foo = "ba'r";
  var foo = '<?php echo $foo; ?>';
}
</script>

第三季度:

这个想法是在每次触发按钮单击事件时发出 AJAX 请求...这相当于当您单击按钮时，您调用一个 javascript 函数，该函数将向其他页面发出请求，并且如果请求成功，可以从中获取一些东西。这里是例子:

<script>
var current = <? echo time(); ?>;
function requestSomething(action){
    if (window.XMLHttpRequest) {
      xmlhttp=new XMLHttpRequest();
    }
    else {
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function(){
      // readyState info: http://www.devguru.com/technologies/xmldom/quickref/httpRequest_readyState.html
      if (xmlhttp.readyState==4 && xmlhttp.status==200){
        // this is where we tell where the result will appear
        document.getElementById("current").innerHTML=xmlhttp.responseText;
        current = xmlhttp.responseText;
      }
    }

    xmlhttp.open("GET","somescript.php?action="+action+'&curday='+current,true);
    xmlhttp.send();
}
</script>

<p style="text-align:center; font-size:14px; color:#03F">
  <button onclick="requestSomething('decrease')" style="width:200px" >< Show Previous Day</button>
  <!-- this is where the result will appear -->
  <span id="current"></span>
  <button onclick="requestSomething('increase')" style="width:200px">Show Next Day ></button>
</p>

现在，在您的 somescript.php 文件中，

<?php 
  if(isset($_GET['action'])){
    if($_GET['action'] == 'increase'){
      // your increasing day logic here
    } elseif ($_GET['action'] == 'decrease'){
      // decreasing logic here
    } else {
      // whatever...
    }
  }
  ?>

注意:这几乎是从头开始编写的，并从各处进行了一些复制/过去，并且没有检查代码是否确实有效...这只是一个指南...

希望有帮助。