無法讀取undefined的屬性

-1

我製作了一個有17個球的程序，然後用戶鍵入他想要查看的球的數量。之後，該程序應該在該特定號碼的屏幕上生成隨機數字球。例如。如果用戶說他想看到5個球，他只能輸入5和5個球或者顯示不同的數字。但問題是，輸出不正確，我得到一個錯誤「無法讀取未定義的屬性'ID'」。這裏是我的代碼。我會在代碼中提到我發生錯誤的確切位置。錯誤前無法讀取undefined的屬性

<html> 
<head> 
</head> 
<script type="text/javascript"> 
    window.onload=draw; 
    function draw(){ 
    var canvas= document.getElementById('canvas'); 
    var ctx=canvas.getContext('2d'); 
    var id; 
    var x; 
    var y; 
    var r; 
    var i; 
    var balls=[{"id":1,"x":85,"y":90,"r":40},{"id":2,"x":180,"y":90,"r":40},{"id":3,"x":270,"y":90,"r":40},{"id":4,"x":360,"y":90,"r":40},{"id":5,"x":450,"y":90,"r":40},{"id":6,"x":535,"y":90,"r":40},{"id":7,"x":623,"y":90,"r":40},{"id":8,"x":710,"y":90,"r":40},{"id":9,"x":85,"y":190,"r":40},{"id":10,"x":180,"y":190,"r":40},{"id":11,"x":270,"y":190,"r":40},{"id":12,"x":360,"y":190,"r":40},{"id":13,"x":450,"y":190,"r":40},{"id":14,"x":535,"y":190,"r":40},{"id":15,"x":623,"y":190,"r":40},{"id":16,"x":710,"y":190,"r":40},{"id":17,"x":450,"y":190,"r":40},{"id":18,"x":535,"y":190,"r":40},{"id":19,"x":623,"y":190,"r":40},{"id":20,"x":710,"y":190,"r":40}]; 
    var texts=[]; 

    for(i=0;i<balls.length;i++){ 
     texts[i]=i; 
    } 

    var choose; 
    choose=parseFloat(prompt("enter the number of balls u want to see")); 
    for (var i=1; i<=choose; i++) { 
     var x=Math.floor((Math.random() * choose) + 1); 
     for (var k=1; k<=balls.length; k++) { 
     var b=balls[k]; 
     if(b.id==x){     /*here is the issue*/ 
      ctx.fillStyle="#800000"; 
      ctx.strokeStyle="#000000"; 
      ctx.beginPath(); 
      ctx.arc(b.x,b.y,b.r,0, 2 * Math.PI); 
      ctx.stroke(); 
      ctx.fill(); 
      ctx.fillStyle = 'black'; 
      ctx.fillText(b.id, b.x, b.y); 
     } 
     } 
    } 
    } 

</script> 
<body> 
<canvas id="canvas" width="800" height="800" style="border: 2px solid #000000"></canvas> 
</body> 
</html>

來源

2016-11-07 Mohammad Khawar

在0處開始for循環，並且只在'k Kaiido

現在是得到結果謝謝，但所需的圈數沒有出現：/例如，如果我寫6我得到4或5，當我輸入3我得到2或東西。我如何解決這個問題？ –

這是因爲你對第一個循環做了同樣的錯誤：'for（i = 0; i Kaiido

兩條線，在您的for循環：

var k=1; k<=balls.length; k++

應該是這個：

var k=1; k<balls.length; k++

否則，最後一次迭代是在balls的最大指數陣列，你得到undefined，而不是像你期望的那樣。

來源

2016-11-07 01:55:29 Drown

它仍然不會顯示所有需要的圓圈，例如，當我寫4時，我得到3個圓圈，有時當我寫6我得到4或5個圓圈和這樣的事情：/ –

這是一個完整的重寫，它的工作原理。我修復了其他問題，例如k < balls.length,parseInt而不是parseFloat，並且一旦找到正確的球就跳出循環。

<html> 
<head> 
</head> 
<script type="text/javascript"> 
    window.onload=draw; 
    function draw(){ 
    var canvas= document.getElementById('canvas'); 
    var ctx=canvas.getContext('2d'); 
    var id; 
    var x; 
    var y; 
    var r; 
    var i; 
    var balls=[{"id":1,"x":85,"y":90,"r":40},{"id":2,"x":180,"y":90,"r":40},{"id":3,"x":270,"y":90,"r":40},{"id":4,"x":360,"y":90,"r":40},{"id":5,"x":450,"y":90,"r":40},{"id":6,"x":535,"y":90,"r":40},{"id":7,"x":623,"y":90,"r":40},{"id":8,"x":710,"y":90,"r":40},{"id":9,"x":85,"y":190,"r":40},{"id":10,"x":180,"y":190,"r":40},{"id":11,"x":270,"y":190,"r":40},{"id":12,"x":360,"y":190,"r":40},{"id":13,"x":450,"y":190,"r":40},{"id":14,"x":535,"y":190,"r":40},{"id":15,"x":623,"y":190,"r":40},{"id":16,"x":710,"y":190,"r":40},{"id":17,"x":450,"y":190,"r":40},{"id":18,"x":535,"y":190,"r":40},{"id":19,"x":623,"y":190,"r":40},{"id":20,"x":710,"y":190,"r":40}]; 

    var choose; 
    choose=parseInt(prompt("enter the number of balls u want to see")); 

    var randomlySelectedBalls = []; 
    var i = 0; 
    while (i < choose){ 
     var x = Math.floor((Math.random() * (balls.length + 1))); 
     if(randomlySelectedBalls.indexOf(x) === -1) { 
     randomlySelectedBalls.push(x); 
     for (var k=0; k<balls.length; k++) { 
      var b=balls[k]; 
      if(b.id==x){     /*here is the issue*/ 
      ctx.fillStyle="#800000"; 
      ctx.strokeStyle="#000000"; 
      ctx.beginPath(); 
      ctx.arc(b.x,b.y,b.r,0, 2 * Math.PI); 
      ctx.stroke(); 
      ctx.fill(); 
      ctx.fillStyle = 'black'; 
      ctx.fillText(b.id, b.x, b.y); 
      break; 
      } 
     } 
     i++; 
     } 
    } 
    } 

</script> 
<body> 
<canvas id="canvas" width="800" height="800" style="border: 2px solid #000000"></canvas> 
</body> 
</html>

來源

2016-11-07 02:15:55 ppovoski

謝謝。但是，輸出不顯示所需的圓圈。如果我輸入3我得到1或2，如果我輸入6我得到5或4什麼的。我該怎麼辦？：/ –

你並不是每次都選擇唯一的隨機數。你可以選擇數字3兩次，只有一個3號球會出現。 – ppovoski

無法讀取undefined的屬性

回答

相關問題