Javascript - Value van radio button verdwijnt direct

[Jasper_S1985]

Ik ben bezig met het leren van javascript en probeer het voor elkaar te krijgen dat ik wat kan doen met de value van een radio button. Nu krijg ik de value wel van de radio button te pakken maar ik wil hem weergeven op het scherm. Als ik de knop in druk komt de tekst daadwerkelijk op het scherm te staan maar is ook na 0.2 seconden weer verdwenen. Wat ben ik vergeten toe te voegen of doe ik het helemaal verkeerd?
Alvast bedankt!


<form id="processor">
<input name="processors" type="radio" id="processor1" value="Intel Core i3" checked> Intel Core i3<br>
<input name="processors" type="radio" id="processor2" value="Intel Core i5"> Intel Core i5<br>
<input name="processors" type="radio" id="processor3" value="Intel Core i7"> Intel Core i7<br>
<input type="submit" onclick="addProcessor()"><br><br>
</form>
<p>Pc lijst</p>
<p id="cpu"></p>
<script>
function addProcessor() {
var cpu = document.querySelector('input[name=processors]:checked').value;
document.getElementById("cpu").innerHTML = cpu;
}
</script>

Edit: Ik merk dat het form zichzelf reset na de submit knop in te drukken en daarmee ook de tekst weghaald.
Op 1 of andere manier moet het formulier zich niet resetten ofzo?

[ Voor 7% gewijzigd door Jasper_S1985 op 14-11-2017 18:44 ]

[spone]

Als je input type=button ipv submit gebruikt is je probleem weg.

De submit knop zorgt ervoor dat je pagina naar de server verstuurd wordt. Aangezien je niks opgegeven hebt wat die locatie is, stuurt ie het naar zichzelf. Effectief refresh je de pagina zo en neemt je formulier weer de initiële waarde aan.

[Ramon]

Dat komt omdat, als je een formulier submit, dat formulier een 'default' actie heeft en die wordt uitgevoerd tenzij je die expliciet stopt. Zie bijvoorbeeld de volgende code:

https://jsfiddle.net/73y12n6d/

[RobIII]

Sorry, maar zo werkt 't hier niet. Kan iemand even...? / Help, mijn script werkt niet (goed).

Neem even onze Quickstart door (als dat nog nodig is na alle rappe replies hierboven ) en post dan een nieuw topic (gebruik dan ook even code tags a.u.b.).

[ Voor 18% gewijzigd door RobIII op 14-11-2017 18:53 ]