2015-02-22 3 views
1

Почему этот простой код не возвращает значение долларового значения с плавающей точкой (объявленные константы)? Я пробовал parseFloat, и это не сработало. Скорее всего, это лучший способ сделать это, но я новичок, но быстро понял концепцию. Заранее спасибо!Почему моя функция не возвращает Float Number

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
    <!--link to CSS Style sheet--> 
    <link href="style.css" rel="stylesheet" type="text/css"> 
    <title>Allen Ricardo's Dance Studio</title> 
      <!--JS Script and function here--> 
      <!--Prompt user to enter an age 
      create variable to hold age 
      create variables to hold constant ticket prices 
      use relational operators and if/else statements to check   
      condition of age 
      output the cost of the ticket.--> 
    <script> 

    function verifyAge() { 
     <!--constant variables for ticket prices--> 
     var TICKET_PRICE_1 = 3.00; 
     var TICKET_PRICE_2 = 7.00; 
     var TICKET_PRICE_3 = 9.00; 
     var age=prompt("Enter Customer's Age: ", ""); 

      if(age < 4 && age > 0) 
       document.getElementById("tickPrice").innerHTML="$" +  
TICKET_PRICE_1; 

       else if(age >= 4 && age <= 16) 
        document.getElementById("tickPrice").innerHTML="$" + 
TICKET_PRICE_2; 

        else if(age > 16) 
         document.getElementById("tickPrice").innerHTML="$" + 
TICKET_PRICE_3; 
     } 
    </script> 

</head> 


<body> 
<!--add image from previous assignment question here--> 

<header> 
    <img src="danc_logo.png" width="200" height="200" alt="Studio Logo"> 
    <h1>Allen Ricardo's Dance Ticket Prices</h1></header> 

    <!--container 1--> 
    <div id="buttonPrompt"> 
     <h2>Click on the button below to enter customer's age</h2></div> 
     <!--container 2--> 
     <div id="defaultDisplay"> 
      <p>Under Age 4 (age &lt; 4) cost is: <strong>$3.00</strong></p> 
      <p>Between ages 4 and 16 (4 ≥ age ≤ 16) cost is: 
<strong>$7.00</strong></p> 
      <p>Older than 16 (age > 16) cost is: <strong>$9.00</strong></p> 
</div> 
      <!--Create button for user here--> 
      <!--Container 3--> 
      <div id="button"> 
       <button type="button" id="ageVerify" 
    onClick="verifyAge()">Enter Customer's Age</button></div> 
       <!--Container 4--> 
       <div id="output"> 
        <p>The Cost of Allen's Ticket is: <span id="tickPrice"> 
    </span></p></div> 
    </body> 
    </html> 
+0

Я знаю, что это очень вероятно, что это игрушечная программа, но не используйте типы с плавающей точкой за деньги. – jdphenix

+0

Не могли бы вы объяснить, почему использование плавающих чисел за деньги нельзя использовать? – allendks45

+1

'prompt' возвращает строку ... – Teemu

ответ

2

Причины неожиданного выхода без каких-либо значений после запятой здесь:

if (age < 4 && age > 0) { 
    document.getElementById('tickPrice').innerHTML = '$' + 
    TICKET_PRICE_1; 
} 
else if (age >= 4 && age <= 16) { 
    document.getElementById('tickPrice').innerHTML = '$' + 
    TICKET_PRICE_2; 
} 
else if (age > 16) { 
    document.getElementById('tickPrice').innerHTML = '$' + 
    TICKET_PRICE_3; 
} 

Если вы хотите набор точности после запятой, используйте toFixed(), изменяя код:

if (age < 4 && age > 0) { 
    document.getElementById('tickPrice').innerHTML = '$' + 
    TICKET_PRICE_1.toFixed(2); 
} 
else if (age >= 4 && age <= 16) { 
    document.getElementById('tickPrice').innerHTML = '$' + 
    TICKET_PRICE_2.toFixed(2); 
} 
else if (age > 16) { 
    document.getElementById('tickPrice').innerHTML = '$' + 
    TICKET_PRICE_3.toFixed(2); 
} 

Обратите внимание, что это соглашение о отображении, а не фактическое изменение числа представленных.

Второй проблемой является использование prompt()

var age=prompt("Enter Customer's Age: ", "") 

prompt() возвращает строку и необходимо будет разобран. Вы могли бы:

var age = parseInt(prompt("Enter Customer's Age: ", "")); 

Why not use floating points for money

В качестве вспомогательной на ваш вопрос и ответ на замечания, рассмотрим следующую разумную ситуацию.

var price = 0.10; 
var fee = 0.20; 
var total = price + fee; 

Номера с плавающей запятой не могут точно представлять все значения. Поскольку числа JavaScript являются числами с плавающей запятой, целые числа в пределах диапазона являются безопасными (- (от 2^53 до 1) до 2^53 - 1).

Так что, если вы выводите общее, вы получите

0.30000000000000004 

Это неправильно, что это должно быть 0,30.

Смежные вопросы