java腳本錯誤對象不支持此屬性或方法

Question

由於某些原因，只有在startSpin（）函數內定義了spinner對象時，spinner對象才能工作。

這是不工作的代碼：

<script type="text/javascript" src="resources/js/spin.js"></script> 
    <script type="text/javascript"> 
     var opts = { 
      lines: 18, // The number of lines to draw 
      length: 40, // The length of each line 
      top: 'auto', // Top position relative to parent in px 
      left: 'auto' // Left position relative to parent in px 
     }; 

     // -- not support ? 
     var target = document.getElementById('spin'); 
     var spinner = new Spinner(opts).spin(target); 
     // -- ??? 
     function startSpin() 
     { 
      spinner.start(); 
     } 
     function stopSpin() 
     { 
      spinner.stop(); 
     } 

     function showStatus() { 
      startSpin(); 
      statusDialog.show(); 
     } 

     function hideStatus() { 
      stopSpin(); 
      statusDialog.hide(); 
     } 
    </script> 
    <h:form id="testfm"> 
     <p:commandButton id="start" type="submit" 
         ajax="false" 
         value="test" 
         actionListener="#{bean.test}" 
         onclick="PrimeFaces.monitorDownload(showStatus, hideStatus)"/> 
     <p:dialog modal="true" 
        widgetVar="statusDialog" 
        showHeader="false" 
        draggable="false" 
        closable="false" 
        resizable="false"> 
      <div id="spin" class="spinner"/> 
     </p:dialog> 
    </h:form> 

當它在spinStart功能

我嘗試用腳本位置玩，但仍然得到了同樣的信息內定義的微調工作只 有什麼想法爲什麼？

感謝

Answer 1

您在運行document.getElementById('spin')之外的功能，用id=spin元素還沒有被創建，讓你給一個空值的微調。如果您在startSpin中創建它，它將響應用戶的點擊事件，因此DOM可能已經在該點建立並且該元素存在。這裏是一個解決辦法：

var spinner; //Lave the variable out here so both functions can see it 

    function startSpin() { 
     var target = document.getElementById('spin'); 
     spinner = new Spinner(opts).spin(target); //Actually create it here, when the element exists 
     spinner.start(); 
    } 
    function stopSpin() { 
     spinner.stop(); 
    } 

你也可以離開的代碼，因爲它是和把它放在你的文檔的末尾，就在</body>標記之前。