2013-08-05 18 views
6

Im folgenden Code, ich versuche valueAsNumber zu nennen, aber ich bekomme nur ein NaN zurückgegeben. Wenn ich parseInt verwende, bekomme ich das Ergebnis, das ich erwarte. Warum ist das?Warum gibt 'valueAsNumber' NaN als Wert zurück?

<html>                                                  
<head>                                                  
<title>JavaScript: Demo 1</title>                                           
<link rel="stylesheet" type="text/css" href="index.css">                                     
</head>                                                  

<body>                                                  
<div id="numbers">                                               
    <div id="inputs">                                               
    <form name="inputForm">                                             
    <div class="prompt">Number 1: <input name="number1" type="text"></div>                                 
    <div class="prompt">Number 2: <input name="number2" type="text"></div>                                 
    </form>                                                 
    </div>                                                 
    <div id="result">                                               
    <div class="prompt">RESULT: <span id="operation_result">&nbsp;</span></div>                                
    </div>                                                 
</div>                                                  
<div id="operations">                                              
<p><a id="add_link" href="#" onClick="add(this)">ADD</a></p>                                    
</div>                                                  

<script type="text/javascript">                                            
    function add(linkElement){                                            
    // var value1 = parseInt(document.inputForm.number1.value); 
    // var value2 = parseInt(document.inputForm.number2.value); 

    var value1 = document.inputForm.number1.valueAsNumber; 
    var value2 = document.inputForm.number2.valueAsNumber;                                    
    var result = value1 + value1;                                           

    document.getElementById('operation_result').innerHTML = result;                                   
    }                                                   
</script>                                                 

</body>                                                  
</html>                                                  

Antwort

10

Ihre Erwartungen angemessen sind die Eigenschaftsnamen unter Berücksichtigung, aber tatsächlichen specs/documentation Lese:

Das valueAsNumber IDL-Attribut stellt den Wert des Elements, als Zahl interpretiert.

Auf immer, wenn das valueAsNumber Attribut gilt nicht, definiert als für den aktuellen Zustand des type-Attribut des Eingabeelement, dann wieder eine Nicht-a-Number (NaN) Wert.

Here's a table betreffenden type s Liste, die auf valueAsNumber anzuwenden. Diese sind:

Datum und Uhrzeit,
Datum,
Monat,
Woche,
Zeit
Lokale Datum und Uhrzeit,
Anzahl
Bereich

Ja, das ist ziemlich seltsam API Entscheidung

+0

dh immer noch NaN zurück. versuchte Typ = Nummer in Windows 10. – VISHMAY

3

Sie haben die type Ihrer input-number einzustellen:

<input name="number1" type="number"> 

Auch, wenn der Wert leer oder nicht-numerisch ist, wird es NaN zurück.

+0

Pass auf, das noch nicht in Rande funktioniert: https://stackoverflow.com/questions/34251265/on-an-inputtype-number-ed ge-always-returns-nan-for-value asnumber –

Verwandte Themen