函数或循环不起作用

因此，两种方法都有问题。方法（this.howMuch）应该计算汽车行驶的距离（基于速度和时间输入）。方法（this.printAll）应该打印关于数组中所有对象的所有信息。我看到的唯一错误是“carConstruct.howMuch不是HTMLButtonElement的函数”。如果我删除第一个方法，则第二个方法会出现同样的错误。函数或循环不起作用

所有帮助表示赞赏。下面的代码：

var vardas = document.getElementById("name"); 
 
var laikas = document.getElementById("time"); 
 
var greitis = document.getElementById("speed"); 
 
var driver = document.getElementById("driver"); 
 
var addCar = document.getElementById("addCar"); 
 
var race = document.getElementById("race"); 
 
var box = document.getElementById("box"); 
 
var cars = []; 
 

 
function carConstruct(name, time, speed, driver, distance){ 
 
    this.name = name; 
 
    this.time = time; 
 
    this.speed = speed; 
 
    this.driver = driver; 
 
    this.distance = 0; 
 
    this.howMuch = function(){ 
 
     for(var i=0; i<cars[i]["time"]; i++){ 
 
      this.distance = this.distance + (cars[i]["speed"] * cars[i]["time"]); 
 
     } 
 
    } 
 
    this.printAll = function(){ 
 
     for(var i=0; i<cars.length; i++){ 
 
     console.log(cars[i]["name"]); 
 
     console.log(cars[i]["speed"]); 
 
     console.log(cars[i]["driver"]); 
 
     console.log(cars[i]["distance"]); 
 
     } 
 
    } 
 
} 
 

 
addCar.addEventListener("click", function(){ 
 
    var carNew = new carConstruct(vardas.value, laikas.value, greitis.value, driver.value); 
 
    cars.push(carNew); 
 
    vardas.value = ""; 
 
    greitis.value = ""; 
 
    driver.value = ""; 
 
}); 
 

 
race.addEventListener("click", function(){ 
 
    carConstruct.howMuch(); 
 
    carConstruct.printAll(); 
 
});

<!doctype html> 
 
<html> 
 
    <head> 
 
     <title>J21ND</title> 
 
     <meta charset="utf-8"> 
 
     <link rel="stylesheet" type="text/css" href="J21ND.css"> 
 
    </head> 
 
    <body> 
 
     <div class="fields"> 
 
      <h1>Car Race</h1> 
 
      <input id="name" type="text" placeholder="Input car name"> 
 
      <input id="time" type="number" placeholder="Input car time"> 
 
      <input id="speed" type="number" placeholder="Input car speed"> 
 
      <input id="driver" type="text" placeholder="Input driver level, select: Rookie or Pro"> 
 
     </div> 
 
     <div class="buttons"> 
 
      <button id="addCar">Add Car</button> 
 
      <button id="race">Start Race</button> 
 
     </div> 
 
     <div id="box"> 
 
     </div> 
 
     <script src="J21ND.js"></script> 
 
    </body> 
 
</html>

来源

2016-12-18 Benua

对，你的构造函数不是它创建的对象的实例，所以它没有这些实例方法。这些应该只是在'cars'阵列上运行的独立功能。 –

'howMuch（）'是'carNew'上可用的方法，而不是'carConstruct' – hackerrdave

你可以通过简单地增加一个全局标志做到这一点。这是自定义的代码。

// Above code will remain same in js and HTML code will remain same as well 
    var flag =0;  
    addCar.addEventListener("click", function(){ 
      var carNew = new carConstruct(vardas.value, laikas.value, greitis.value, driver.value); 
      cars.push(carNew); 
      flag=1; 
      vardas.value = ""; 
      greitis.value = ""; 
      driver.value = ""; 
     }); 

     race.addEventListener("click", function(){ 
      if(flag!=0){ 
       var addedCar = cars.pop() 
       addedCar.howMuch(); 
       addedCar.printAll(); 
       flag =0; 
      }else{ 
       alert('Please Add Car First'); 
       flag =0; 
      } 
     });

来源

2016-12-18 20:30:50

函数或循环不起作用

回答

相关问题