CODEWITHSUNDEEP
javascriptonclick
Jarco
Jarco

Reputation: 1775

onclick event result disappears

When I use this code the console.log and the value in the field disappear right away.

window.onload = bereken;
function bereken(){
    var knop = document.getElementById('berekenKnop').onclick = function (){
        var aantalKm = document.getElementById('bereken');
        console.log(aantalKm.value);
    };
}

How can I prevent that from happening. Or what am I doing wrong?

The final goal will be to append the result of a calculation by the value of the field into another field.

edit:

<html>
<head>
<script src="bereken.js"></script>
</head>
<body>
<form id="berekenForm">
  Bereken: <input type="text" name="bereken" id="bereken"/><br />
  <input type="submit" value="Bereken" id="berekenKnop"/>
</form>
</body>
</html>

Upvotes: 0

Views: 272

Answers (2)

Virtual
Virtual

Reputation: 2191

The submit button is doing its default task. i.e. submitting the form. Try handling that.

Upvotes: 3

Umesh Patil
Umesh Patil

Reputation: 10695

Value in the field 'bereken' not disappearing.See the code below. If this is not the expected answer, please, Update the question with question in details:

<html>
<head>
<script type="text/javascript">
window.onload = bereken;
function bereken(){
    var knop = document.getElementById('berekenKnop').onclick = function (){
        var aantalKm = document.getElementById('bereken');
        console.log(aantalKm.value);
    };
}
</script>
</head>
<body>
<div id="berekenKnop">
Click Here to console value
</div><br/>
<input type="text" value=" bereken value" id="bereken" />
</body>
</html>

Upvotes: 0

Related Questions