2016-06-09 96 views
0

下面是代碼:爲什麼我從這段代碼中得到一個JavaScript錯誤?

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <title>An app</title> 

    </head> 
    <body> 
    <p id='namespace'> Namelist </p> 
    <button id="display" type="button">Display numbers</button></br> 
    <button id="likebutton" type="button">Like</button> 
    <button id="dislikebutton" type="button">Dislike</button> 

    </body> 

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.12.1.min.js"></script> 
    <script> 
    $(document).ready(function(){ 
    var names = ['Hannah', 'Lucy', 'Brenda', 'Lauren', 'Mary']; 
    var liked = []; 
    var disliked = []; 



    function showName(){ 
     var name = names[0]; 
     if (!name){ 
     name = 'Out of people'; 
     } 
     document.getElementById('namespace').innerHTML = name; 
    } 
    function like(){ 
     liked.push(names[0]); 
     names.splice(0, 1); 
     showName(); 
    } 
    function dislike(){ 
     disliked.push(names[0]); 
     names.splice(0, 1); 
     showName(); 
    } 

    showName(); 
    document.getElementById('likeButton').onclick = like; 
    document.getElementById('dislikeButton').onclick = dislike; 

}); 
    </script> 
</html> 

電流誤差這樣說:uncaught TypeError: Cannot set property 'onclick' of null

我用Google搜索這個錯誤,這似乎是關於DOM,也許怎麼要素還沒有完全加載到的東西網頁或什麼?

我希望解決方案在用戶點擊喜歡或不喜歡按鈕後彈出不同的名稱。然後在數組的末尾,文本將不會顯示更多人。

+0

'likeButton'和'dislikeButton'應該是完整的小案例,對不對? – RRK

回答

0

你的按鈕的id是likebutton和你得到它通過likeButton

變化

document.getElementById('likeButton').onclick = like; 

document.getElementById('likebutton').onclick = like; 

同樣是dislikebutton的情況。

+0

謝謝,非常想念那個。你知道我怎麼才能看看控制檯中的數組?我有控制檯打開並開始鍵入liked.length但它告訴我喜歡沒有定義? – Areeety

+0

您可以在要檢查控制檯的行之前編寫'debugger;',以查看數組的值或任何您想要的值。另外,不要忘記將答案標記爲已接受的答案。 – Mairaj

相關問題