Tekstvak-value's aanroepen

Status
Niet open voor verdere reacties.

Webdesigner4

Gebruiker
Lid geworden
3 nov 2012
Berichten
39
Ik wil dat als je op een button klikt, de ene waarde uit het tekstvak met de andere waarde uit een ander tekstvak wordt vermenigvuldigd.
Het moeten dan wel cijfers zijn die worden ingevoerd.
Waarom werkt dit script dan niet?

<html>
<head>
<title>Beweging</title>
</head>
<body>
<script type="text/javascript">
function gemiddeld()
{
var x = document.getElementById("naam1").value;
var y = document.getElementById("naam2").value;
var z = x/y;
document.getElementById("demo").innerHTML=z;
}
</script>

Voer hier de tijd in seconden in:<input type="text" name="naam1">
<br>
Voer hier de afstand in meters in:<input type="text" name="naam2">
</br>
<input type="button" value="Bereken!" name="naam4" onclick="gemiddeld()">
<p id="demo">hoi</p>
</body>
</html>

Weet iemand hoe dit zit?
Bij voorbaat dank,

Webdesigner4
 
De waarden in tekstvlakken zijn altijd strings (stukjes tekst). Om de computer te vertellen dat ze geïnterpreteerd moeten worden als getallen gebruik je de functie parseInt (voor gehele getallen) of parseFloat (voor decimale getallen). http://www.w3schools.com/jsref/jsref_parseint.asp

parseInt geef je, naast de om te zetten string, nog een tweede parameter: de radix. Deze geeft aan in welk getalsysteem je werkt ;)

[JS]x = parseInt(x, 10);
y = parseFloat(y);[/JS]
 
Laatst bewerkt:
Dus hoe schrijf ik dit script nou?
Sorry, ik ben nog maar een amateur...:)
Trouwens bedankt voor je antwoord.

Webdesigner4
 
Geeft niet hoor :P Je hoeft eigenlijk maar een paar regeltjes toe te voegen aan de gemiddeld/I]-functie, met als resultaat:
[JS]function gemiddeld()
{
var x = document.getElementById("naam1").value;
var y = document.getElementById("naam2").value;
x = parseInt(x, 10);
y = parseInt(y, 10);
var z = x/y;
document.getElementById("demo").innerHTML=z;
}[/JS]

Wat je hier ziet is dat x (en y) eerst de waarden uit de tekstvelden aannemen (strings), en daarna, op regel 5 en 6, omgezet worden in gehele getallen (integers - vandaar ook de naam parseInt). Daarna kan de deling (of een andere wiskundige bewerking) plaatsvinden.

Gr. Robin
 
Dat is niet per se nodig. Omdat je ze door elkaar gaat delen worden de strings automatisch omgezet in getallen. De reden dat je script niet werkt is dat je de invulvelden "naam1" en "naam2" geen id hebt gegeven. Daardoor kan je ze niet ophalen met getElementById. Als je de id's toevoegt werkt je script wel:
HTML:
Voer hier de tijd in seconden in:<input type="text" name="naam1" id="naam1">
<br>
Voer hier de afstand in meters in:<input type="text" name="naam2" id="naam2">
 
Dank iedereen voor de reacties.
Alleen probleempje, m'n script werkt nog steeds niet:
Bedoeling van het script zie vraag.
Dit is het script:

HTML:
<html>
<head>
<title>Beweging</title>
</head>
<body>
Voer hier de tijd in seconden in:<input type="text"  id="naam1">
<br>
Voer hier de afstand in meters in:<input type="text"  id="naam2">
 </br>
<input type="button" value="Bereken!" name="naam4" onclick="gemiddeld()">
<p id="demo">hoi</p>
<script type="text/javascript">
function gemiddeld()
{
var x = document.getElementById("naam1").value;
var y = document.getElementById("naam2").value;
x = parseInt(x,10);
y = parseInt(y,10);
var z = x/y;
document.getElementById("demo")=z;
}
</script>
</body>
</html>
 
Je ben "innerHTML" vergeten op regel 20:
[js]document.getElementById("demo").innerHTML=z;[/js]
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan