腳本調用其他php頁面不工作

Question

需要幫助，按鈕不工作，我的主頁面上的報告生成器按鈕沒有調用report.php頁面，在Chrome瀏覽器中，我檢查了開發人員工具下的網絡選項卡和IM沒有得到任何活動/響應當我點擊報告生成器按鈕，下面是我的主要PHP頁面：

<script type="text/javascript"> 

      $(document).ready(function(){ 
      $("#RetrieveList").on('click',function() { 
       var xid = $('#XiD').val(); 
       var date = $('#Date').val(); 
       $.post('retrieve_test.php',{xid:xid, date:date}, function(data){ 
       $("#results").html(data); 
       }); 
       return false; 
      }); 

      $("#DeletefromDB").click(function() { 
       if (confirm("Are you sure you want to delete?")) 
       var id = $('input[name=checkbox]:checked').map(function() 
        { 
         return $(this).val(); 
        }).get(); 
       $.post('delete_test.php',{id:id}, function(data){ 
       $("#result").html(data); 
       }); 

       return false; 
      });     
      }); 

      $("#Report").on('click',function() { 
      var date = $('#Date').val(); 
       $.post('report.php',{date:date}, function(data){ 
       $("#results").html(data); 
       }); 
       return false; 
      }); 

    </script> 

     <form id="form2" name="form2" method="post" action=""> 

       <table width="741" border="0" align="center"> 
       <tr> 
        <th colspan="9" align="center" style="font-size:14px" scope="col">Xid, Name:<span> 
        <select name="XiD" id="XiD"> 

         <option value="AAA">AAA</option> 
         <option value="BBB">BBB</option> 
         <option value="" selected="selected">Please Select...</option> 
        </select> 
        </span><span style="font-size:14px"> 
        <label for="date">Date:</label> 
        <input type="text" name="Date" id="Date" size="8"/> 
        </span></th> 
       </tr> 
       <tr> 
        <th colspan="9" scope="col">&nbsp;</th> 
       </tr> 
       <tr> 
        <th colspan="9" scope="col"> 
        <div align="center"> 
         <input name="action" type="button" id="RetrieveList" value="Retrieve List" /> 
         <input name="action" type="button" id="DeletefromDB" value="Delete from DB" /> 
         <input name="Clear" type="reset" id="Clear" value="Clear" onClick="window.location.reload()" /> 
        <input name="action" type="button" id="Report" value="Report Generator" /> 
        </div> 
        <label for="Clear"></label> 
        <div align="center"></div></th> 
       </tr> 

       </table> 
       </form> 
      <div id="results"> 
      </div> 

，而這裏是我的report.php頁面代碼：

<?php 
    require 'include/DB_Open.php'; 

    $date = $_POST['date']; 

    $sql="SELECT trouble_type_priority, category_1, category_2, status, COUNT (*) AS Total 
       FROM tbl_main 
       WHERE resolved_date = '$date' 
       GROUP BY trouble_type_priority, category_1, category_2, status"; 

    $myData = mysql_query($sql)or die(mysql_error()); 

    echo "<table width='auto' cellpadding='1px' cellspacing='0px' border=1 align='center'> 
    <tr> 
     <th colspan='3' align='center'>Ticket Bucket</th> 
     <th colspan='3' align='center'>Status</th> 
    </tr> 
    <tr> 
     <th width='auto' align='center'>Severity</th> 
     <th width='auto' align='center'>Category 2</th> 
     <th width='auto' align='center'>Category 3</th> 
     <th width='auto' align='center'>Resolved</th> 
     <th width='auto' align='center'>Re-assigned</th> 
     <th width='auto' align='center'>Grand Total</th> 
    </tr>"; 

    while($info = mysql_fetch_array($myData)) 
    { 
    echo"<tr>"; 

    echo "<td align='center'>" . $info['trouble_type_priority'] . "</td>"; 
    echo "<td align='center'>" . $info['category_1'] . "</td>"; 
    echo "<td align='center'>" . $info['category_2'] . "</td>"; 
    echo "<td align='center'>" . $info['status'] . "</td>"; 
    echo "</tr>"; 
    } 
    echo "</table>"; 


    include 'include/DB_Close.php'; 
    ?> 

Answer 1

它看起來像您爲報表按鈕設置onclick事件的代碼已超出de的$(document).ready(...)功能。現在，您的JavaScript將在頁面的其餘部分準備好之前執行，並且此時不會有Report按鈕將事件添加到它。

我想，這可能是問題。嘗試將$("#Report").on('click', ...)移入$(document).ready(...)回調函數。

Answer 2

我無法格式化評論，但獲取有關正在發生的事情的更多信息，可以使用console.log一些事情：並不確定這是否有幫助，但將日期屬性放在引號中：{'date'：date}

 console.log("adding click handler to:",$("#Report")); 
     $("#Report").on('click',function() { 
      console.log("date will be:",$('#Date').val()); 
      var date = $('#Date').val(); 
      $.post('report.php',{'date':date}, function(data){ 
      $("#results").html(data); 
      }); 
      return false; 
     });