未捕獲ReferenceError - 函數未定義

我創建了一個帶有幾個按鈕的小型網站。每個按鈕都應該調用以前定義的JS函數。但每按一下按鈕，我都會得到一個ReferenceError，指出函數未定義。未捕獲ReferenceError - 函數未定義

(index):1 Uncaught ReferenceError: mainLightOn is not defined

這裏是我的網站的代碼：

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 
    <title>Home Cinema Control Center</title> 
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" type="text/css" /> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js" type="text/javascript"></script> 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" type="text/javascript"></script> 
    <style type="text/css"> 
     td { 
      padding: 10px; 
     } 
     body { 
      font-family: Segoe UI, Arial, sans-serif; 
      background-color: #636363; 
     } 
     p { 
      color: #3b3b3b; 
      font-size: 4.0em; 
     } 
     .btn-xlarge { 
      padding: 18px 28px; 
      font-size: 3.5em; 
      line-height: normal; 
      border-radius: 8px; 
     } 
     .box { 
      background-color: #fbfbfb; 
      margin: 120px auto; 
      padding: 20px; 
      border-radius: 5px; 
      box-shadow: 10px 15px 20px rgba(0, 0, 0, 0.3); 
     } 
    </style> 
    <script type="text/javascript"> 
     function httpGetAsync(theUrl) { 
      var xmlHttp = new XMLHttpRequest(); 
      xmlHttp.onreadystatechange = function() { 
       if (xmlHttp.readyState == 4 && xmlHttp.status == 200) { 
        // Add stuff later 
       } 
      } 
      xmlHttp.open("GET", theUrl, true); 
      xmlHttp.send(null); 
     } 

     function mainLightOn() { 
      httpGetAsync("/api/mainlight/1"); 
     } 

     function mainLightOff() { 
      httpGetAsync("/api/mainlight/0"); 
     } 
    </script> 
</head> 

<body> 
    <div class="box" style="width:90%; display:table"> 
     <table style="width:100%"> 
      <tr> 
       <td style="width:40%;"> 
        <p>Main Light</p> 
       </td> 
       <td style="width:30%;"> 
        <button type="button" class="btn btn-success btn-xlarge btn-block" onclick="mainLightOn()">On</button> 
       </td> 
       <td style="width:30%;"> 
        <button type="button" class="btn btn-danger btn-xlarge btn-block" onclick="mainLightOff()">Off</button> 
       </td> 
      </tr> 
     </table> 
    </div> 
</body> 

</html>

奇怪的是，當我從我的服務器打開網站就只出現錯誤。當我在筆記本電腦上本地打開html時，這些功能被稱爲罰款。

來源

2016-09-23 Boris

如果你包含jQuery，爲什麼不使用它和它的AJAX方法？我也無法根據您發佈的代碼重現您所看到的錯誤。 – j08691

當你嘗試過時，你是否在函數'.ready（）'處理函數'

你的函數定義命名的功能是$().ready(function() {... })體內，所以範圍就是這樣的功能。從HTML元素執行的Javasript在全局範圍內執行。

有沒有必要把這些功能放在$().ready()內。如果在運行之前必須等待DOM準備就緒，則只需將代碼放在那裏。但是這些函數只有在用戶點擊元素時纔會執行，直到DOM準備好纔會發生。

來源

2016-09-23 21:03:28 Barmar

那麼我如何從這個（隱式？）現成體中獲得函數呢？ – Boris

我不知道爲什麼我認爲他們是在一個函數內。我前幾天一定在看東西。 – Barmar

相關問題