2011-10-10 51 views
1

這是一個問題,我不明白,因爲所有的代碼驗證。這是我午夜的作業。當我按回車時,我得到isNaN,但值是一個數字

當我在'價格'文本框中輸入一個值並按回車時,我在'總計'文本框中獲得$ isNaN。有什麼建議麼。下面是代碼:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4  /loose.dtd"> 
<html> 
<head> 
<title>Price Calculator</title> 
<script type="text/javascript"> 
function fixOrder() 
{ 
    var numPrice = parseFloat(document.getElementById("cost").value); 
    var taxP = parseFloat(document.getElementById("tax").value); 
    //var total = parseFloat(document.getElementById("total").value); 

    if (isNaN(numPrice)){ 
    alert("Sorry,you must enter a numeric value to place order"); 
    if (isNaN(taxP)) 
     alert("Sorry, you must enter a numeric tax value to continue"); 
    } 

    var tax = (numPrice * taxP)/100; 
    var total = numPrice + tax; 
    document.getElementById("total").value = "$" + total.toFixed(2); 
} 
</script> 

</head> 

<body bgcolor="#00f3F1"> 

<h1 align="left">Price Calculator</h1> 

<form name="form"> 
<p> 
    Price: <input type="text" id="cost" name="cost" value="" onchange="fixOrder();"/> 
</p> 
<p> 
Tax: &nbsp; <input type="text" id="tax" name="tax" value="" onchange="fixOrder();"/> 
</p> 
<p> 
    Total: <input type="text" id="total" name="total" value="" disabled="disabled();"/> 
</p> 
</form> 

</body> 
</html> 
+0

使用JavaScript調試閱讀起來。查看Firebug for Firefox或Chrome中的調試工具。 IE9也有不錯的開發者工具。這使得解決這樣的問題變得更容易。這是一個關於Chrome調試器的小教程。 http://www.alexatnet.com/content/sample-debug-session-google-chrome-javascript-debuger – mrtsherman

+1

只要我添加提示 - 查看jsLint。它檢測代碼中的語法錯誤。例如,訪問這個小提琴並點擊頂部的jsLint按鈕。它會發現這個問題。 http://jsfiddle.net/MVG5q/ – mrtsherman

+0

我剪切並粘貼到W3schools tryit編輯器,它工作正常。不過,我想我同意你需要學習一個調試工具。 –

回答

1

嘗試:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4  /loose.dtd"> 
<html> 
<head> 
<title>Price Calculator</title> 
<script type="text/javascript"> 
function isNumber(value) { 
    return typeof value === 'number' && 
      isFinite(value); 
} 

function fixOrder() 
{ 
    document.getElementById("total").value = ""; // clear the total field 
    var numPrice = parseFloat(document.getElementById("cost").value); 
    var taxP = parseFloat(document.getElementById("tax").value); 
    //var total = parseFloat(document.getElementById("total").value); 

    if (isNaN(numPrice)) { 
     alert("Sorry,you must enter a numeric value to place order"); 
     return; // exit function to avoid calculation 
    } 
    if (isNaN(taxP)) { 
     alert("Sorry, you must enter a numeric tax value to continue"); 
     return; // exit function to avoid calculation 
    } 

    var tax = (numPrice * taxP)/100; 
    var total = numPrice + tax; 
    document.getElementById("total").value = "$" + total.toFixed(2); 

} 

</script> 

</head> 

<body bgcolor="#00f3F1"> 


<h1 align="left">Price Calculator</h1> 

<form name="form"> 
<p> 
Price: <input type="text" id="cost" name="cost" value="" onchange="fixOrder();"/> 
</p> 
<p> 
Tax: &nbsp; 
<input type="text" id="tax" name="tax" value="" onchange="fixOrder();"/> 
</p> 
<p> 
Total: 
<input type="text" id="total" name="total" value="" disabled="disabled"/> 
</p> 
</form> 

</body> 
</html> 
+0

isNumber()函數未被使用。但是您可以使用它來測試未來的值是否爲數字。 –

2

我想你忘記關閉{},你應該return避免計算。

if (isNaN(numPrice)) { 
    alert("Sorry,you must enter a numeric value to place order"); 
    return; 
} 

if (isNaN(taxP)) { 
    alert("Sorry, you must enter a numeric tax value to continue"); 
    return; 
} 
+0

謝謝。看,我正在學習一些我在教科書中沒有看到的東西。我參加的這門課程是在線的。所以我鼓勵上網尋找答案。我得到它們。 – swydell

0

禁用= 「禁用();」可能是一個問題 - 使其只能讀取,並且稅也是如此。

您可以從價格中計算稅金和總額。

您第一次更改任一輸入時,您的代碼正在讀取一個空值(NaN)。

你不需要名字,不給表單元素相同標識符作爲自己handlers-變量他們在某些瀏覽器全局..

+0

disabled =「disabled」會做。 –

+0

我的教授的指令是使用disable =「disabled」現在代碼工作好多了。在第一個字段中輸入值後,我在稅務字段中輸入了一個值,賓果在總字段中得到了結果。男人,我很高興。 – swydell

相關問題