2014-12-13 50 views
1

当我加载我的index.html站点时,它有时会返回Ajax,它会调用服务器上的php来打印我的动态页面的结果。为什么只有当我进入地址栏并按回车或刷新时才有效?Ajax调用服务器PHP只有时打印回请求

这是网站Click Here!

这一直困扰着我了一段时间了。

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <title>Christmas- 2014: Secret Santa</title> 
 
    <meta charset="UTF-8"> 
 
    <link rel="stylesheet" type="text/css" href="css/styleSheet.css"> 
 
    <link rel="icon" type="icon" href="images/favicon.ico"> 
 

 
    <script> 
 
    var xmlhttp; 
 
    if (window.XMLHttpRequest) { 
 
     //code for IE7, Firefox and everything new.... 
 
     xmlhttp = new XMLHttpRequest(); 
 
    } else { 
 
     //for the old things 
 
     xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
 
    } 
 

 

 

 

 
    xmlhttp.onreadystatechange = function() { 
 
     if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
 
     document.getElementById("mainDynamic").innerHTML = xmlhttp.responseText; 
 
     } 
 

 

 

 

 

 
     $(document).ready(function() { 
 
     $("#export_excel_button").click(function(e) { 
 

 
      window.open('data:application/vnd.ms-excel,' + $('#userTable').html()); 
 
      e.preventDefault(); 
 
     }); 
 

 
     }); 
 

 

 
    } 
 

 
    xmlhttp.open("GET", "resourceLines.php", true); 
 
    xmlhttp.send(); 
 
    </script> 
 
    <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js'></script> 
 
    <script type="text/javascript"> 
 
    </script> 
 
</head> 
 

 
<body id='mainBody'> 
 
    <img class="Banner" src="images/Banner.JPG" alt="Banner" width="886" height="187"> 
 
    <section> 
 
    <div id='mainDynamic'> 
 

 

 
    </div> 
 
    <article class='leftSide'> 
 
     <div class="Presentations"> 
 
     <h1>Important Information</h1> 
 
     <b>WebSite Scheme:</b> 
 
     <br> 
 
     <p>The Purpose of this is to have computer generated randomization of the "Secret Santa gifting". All wish list can be made online and will be automatically uploaded to the server. Then, I will run the program to randomly pair you then display the 
 
      wish list to whom you'll be a secret Santa to.</p> 
 

 
     <p>So things to do: 
 
      <p> 
 
      <ul> 
 
       <li>Make an account</li> 
 
       <li>Build your wish list</li> 
 
      </ul> 
 
      <p><b>WARNING</b>: It is important that you make only ONE! account for yourself. 
 
       <p> 
 

 
       <p> 
 
        <b>Gifting Criteria:</b> 
 
        <br> 
 

 
        <ul> 
 
        <li><b>Amount of Gifts-</b> Each person should have at least 3 gifts for the gift-er to chose from</li> 
 
        <li><b>Price of Total Gifts-</b> $50</li> 
 
        <li>Total Amount of gifts you buy for the person must be close to equal or more than $50</li> 
 
        </ul> 
 
        <br> 
 
        <b>Commonly Asked Questions</b> 
 
        <ul> 
 
        <li>Can we list multiple gifts on our wish list to add up to the <b>MAX</b> dollar amount? Yes, if there are multiple low priced items, you will have to chose to buy enough gifts to add up to the total amount.</li> 
 
        </ul> 
 
       </p> 
 
     </div> 
 
    </article> 
 
    </section> 
 
</body> 
 

 
</html>

+0

你不允许使用JQuery的AJAX方法? – 2014-12-13 05:05:32

+0

可能与尚未加载的文档有关。你有任何错误?您是否尝试将JavaScript代码移动到页面底部,即在结束''标记之前? – 2014-12-13 05:06:02

+1

在实际使用之前,还应该包含jQuery库。查看控制台中的错误。 – 2014-12-13 05:08:13

回答

1

我检查您的网站,建议低于:

  1. 的错误是,当你使用$(document).ready(function() {...}(这是你的XMLHttpRequest内),没有加载jQuery的。所以,它导致错误Uncaught ReferenceError: $ is not defined

  2. 首先加载jQuery,你的错误不会再发生。

  3. 如果您使用jQuery,为什么不使用$.ajax? jQuery为你浏览器兼容!下面

代码:

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js'></script> 
<script> 
$(function() { // execute after dom loaded 
    $.ajax({ 
     url: 'resourceLines.php' 
    }).done(function(res) { 
     // do whatever you like 
    }); 
}); 
</script>