2011-10-10 2 views
1

이것은 모든 코드의 유효성을 검사하기 때문에 이해할 수없는 문제입니다. 오늘 밤 한밤중에 끝낼 숙제 야.Enter 키를 누르면 isNaN이 표시되지만 값은 숫자

'Price'텍스트 상자에 값을 입력하고 Enter 키를 누르면 'Total'텍스트 상자에 $ 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

. Firefox의 Firebug 또는 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 = "사용 안함"으로 설정됩니다. –

+0

교수님의 제 지시는 disable = "disabled"를 사용하는 것이 었습니다. 코드가 더 잘 작동하고 있습니다. 첫 번째 필드에 값을 입력 한 후 세금 필드에 값을 입력하고 빙고로 총 필드에 결과를 얻었습니다. 나는 행복하다. – swydell

관련 문제