Javascript：輸入欄不工作或給出任何結果

我做了一個程序，詢問用戶他要顯示多少個輸入欄，然後用戶必須在輸入欄中輸入一些值並點擊驗證，但是我遇到的問題是，只要我點擊確認，沒有任何反應。我得到的錯誤：Javascript：輸入欄不工作或給出任何結果

Uncaught TypeError: Cannot read property 'value' of null

每當我點擊驗證。

這裏是我的代碼：

<html> 
 
    <head> 
 
    <script language="javascript"> 
 
     var x = []; 
 
     var choose; 
 
     var i; 
 
     var xar=[]; 
 
     choose=parseFloat(prompt("how many inputs u want to display")); 
 
     for(i=0;i<choose;i++) 
 
     x[i]=document.getElementById("cont"+i).style.visibility="visible"; 
 

 
     function hola() { 
 
     for(i=0;i<choose;i++) 
 
      document.getElementById("cont"+i).style.visibility="visible"; 
 

 
     } 
 

 

 
     function verify(){ 
 
     for(i=0;i<choose;i++){ 
 
      xar[i]=document.getElementById("userNumber"+i).value; 
 
     } 
 
     for(i=0;i<choose;i++) 
 
      if(xar[i]==i) 
 
      alert("good"); 
 
      else 
 
      alert("wrong"); 
 
     } 
 

 
    </script> 
 
    </head> 
 

 
    <body> 
 
    <input type="button" onclick="hola()" value="hidefield0" id="boton0"> 
 

 
    <div id="cont0" style="visibility: hidden;"> 
 
     <input type="text" id="userNumber" class="something"> 
 
    </div> 
 
    <input type="button" onclick="hola()" value="hidefield2" id="boton1"> 
 
    <div id="cont1" style="visibility: hidden;" class="something"> 
 
     <input type="text" id="username2"> 
 
    </div> 
 

 
    <input type="button" onclick="hola()" value="hidefield1" id="boton2"> 
 

 
    <div id="cont2" style="visibility: hidden;" class="something"> 
 
     <input type="text" id="username3"> 
 
    </div> 
 
    <input type="button" onclick="hola()" value="hidefield3" id="boton3"> 
 

 
    <div id="cont3" style="visibility: hidden;" class="something"> 
 
     <input type="text" id="username4"> 
 
    </div> 
 
    <input type="button" onclick="hola()" value="hidefield4" id="boton4"> 
 

 
    <div id="cont4" style="visibility: hidden;" class="something"> 
 
     <input type="text" id="username5"> 
 
    </div> 
 
    <input type="button" onclick="hola()" value="hidefield5" id="boton5"> 
 

 
    <div id="cont5" style="visibility: hidden;" class="something"> 
 
     <input type="text" id="username6"> 
 
    </div> 
 
    <input type="button" id="verifyBtn" value="verify" onclick="verify()"> 
 
    </body> 
 
    <html>

來源

2016-11-10 Buffy Anne-summers

是否有您所使用的任何HTML？ – Shniper

是的抱歉忘了把它放在..掛在我會做到這一點 –

@Suniper我包括的HTML :)謝謝你幫助順道。你認爲我在代碼中做錯了什麼？：/ –

，當它到達該部分腳本失敗：

document.getElementById("userNumber"+i)

這表明不存在元素稱爲userNumber + i（即「userNumber3」）爲您然後撥打.value財產（無法讀取空值的屬性'值'）。

那是因爲你有「USERNAME2，USERNAME3，username4等」和「userNumber」的IDS元素，但不是「userNumber」加一個數字。

 var x = []; 
 
     var choose; 
 
     var i; 
 
     var xar=[]; 
 
     choose=parseFloat(prompt("how many inputs u want to display")); 
 
     for(i=0;i<choose;i++) 
 
     x[i]=document.getElementById("cont"+i).style.visibility="visible"; 
 

 
     function hola() { 
 
     for(i=0;i<choose;i++) 
 
      document.getElementById("cont"+i).style.visibility="visible"; 
 

 
     } 
 

 

 
     function verify(){ 
 
     for(i=0;i<choose;i++){ 
 
      xar[i]=document.getElementById("userNumber"+i).value; 
 
     } 
 
     for(i=0;i<choose;i++) 
 
      if(xar[i]==i) 
 
      alert("good"); 
 
      else 
 
      alert("wrong"); 
 
     }

<input type="button" onclick="hola()" value="hidefield0" id="boton0"> 
 

 
    <div id="cont0" style="visibility: hidden;"> 
 
     <input type="text" id="userNumber" class="something"> 
 
    </div> 
 
    <input type="button" onclick="hola()" value="hidefield2" id="boton1"> 
 
    <div id="cont1" style="visibility: hidden;" class="something"> 
 
     <input type="text" id="userNumber2"> 
 
    </div> 
 

 
    <input type="button" onclick="hola()" value="hidefield1" id="boton2"> 
 

 
    <div id="cont2" style="visibility: hidden;" class="something"> 
 
     <input type="text" id="userNumber3"> 
 
    </div> 
 
    <input type="button" onclick="hola()" value="hidefield3" id="boton3"> 
 

 
    <div id="cont3" style="visibility: hidden;" class="something"> 
 
     <input type="text" id="userNumber4"> 
 
    </div> 
 
    <input type="button" onclick="hola()" value="hidefield4" id="boton4"> 
 

 
    <div id="cont4" style="visibility: hidden;" class="something"> 
 
     <input type="text" id="userNumber5"> 
 
    </div> 
 
    <input type="button" onclick="hola()" value="hidefield5" id="boton5"> 
 

 
    <div id="cont5" style="visibility: hidden;" class="something"> 
 
     <input type="text" id="userNumber6"> 
 
    </div> 
 
    <input type="button" id="verifyBtn" value="verify" onclick="verify()">

來源

2016-11-10 14:51:53

，但我怎麼能添加「用戶名」+一個數字輸入標籤：/ –

btw謝謝你試圖幫助我。真的很感謝 –

@ BuffyAnne夏天「添加」他們在哪裏？只是改變HTML，使得這些元素不被稱爲'username2'等，而被命名爲'userNumber2'等。 –

Javascript：輸入欄不工作或給出任何結果

回答

相關問題