2017-04-05 31 views
0

好吧,讓我的代碼在下面。點擊計算價格按鈕後,我希望它在按鈕下方顯示結果。即。汽車數量= CarNumber,汽車類型= CarType和汽車價格= CarPrice。我知道這可能是非常容易做的,但我不能讓它工作。不確定如何使用getelementbyId顯示結果// javascript

HTML:

<!DOCTYPE html> 
<html> 
<body> 
<form name="Cars"> 
<h1>Car Sales</h1> 
<p>Which type of car would you like (A, B or C)</p> 
<input type="text" name="CarType"><br> 
<p>how many cars would you like (1-100)</p> 
<input type="text" name="CarNumber"><br> 
<br> 
<button onclick="return beginfunction()">Calculate Price</button> 
<p id="message"></p> 
<script src="car.js"> </script> 
</form> 
</body> 
</font> 

的JavaScript:

function beginfunction() { 
    var CarType = document.forms["Cars"]["CarType"].value; 
    var CarNumber = document.forms["Cars"]["CarNumber"].value; 
    var CarPrice; 
    if (!(CarType == 'A' || CarType == 'B' || CarType == 'C')) { 
    CarTypeError = "Invalid Car Type"; 
    document.getElementById("message").innerHTML = CarTypeError; 
    return false; 

    } 


    { 
     if (isNaN(CarNumber)) { 
     CarNumberError = "Invalid Quantity Entered"; 
     document.getElementById('message').innerHTML = CarNumberError; 
      return false; 
     } 

    } 
{ 
    if (CarNumber >0 && CarNumber <10) 
    { 

    } 
    else 
    CarError = "Invalid"; 
    document.getElementById('message').innerHTML = CarError; 
    return false; 
} 
{ 
if (CarType == 'A') { 
    CarPrice = 30; 
} else if (CarType == 'B') { 
    CarPrice = 20; 
} else if (CarType == 'C'){ 
    CarPrice = 10; 
} 
} 

} 

回答

0

你使用innerHTML是正確的,但在你的函數一些邏輯問題的方法,這裏是重構代碼:

function beginfunction() { 
    var CarType = document.forms["Cars"]["CarType"].value; 
    var CarNumber = document.forms["Cars"]["CarNumber"].value; 
    var CarPrice; 
    var message = ""; 

    if (!(CarType == 'A' || CarType == 'B' || CarType == 'C')) { 
    message = "Invalid Car Type"; 
    }else{ 
    if (CarType == 'A') { 
     CarPrice = 30; 
    } else if (CarType == 'B') { 
     CarPrice = 20; 
    } else if (CarType == 'C'){ 
     CarPrice = 10; 
    } 
    message = CarPrice; 
    } 

    if (isNaN(CarNumber)) { 
    message = "Invalid Quantity Entered"; 
    } 

    if (CarNumber >0 && CarNumber <10) 
    { 

    } 
    else{ 
    message = "Invalid"; 
    } 

    document.getElementById('message').innerHTML = message; 
    return false; 
}