Geek Answers Handbook

Text quickly disappears after clicking send

There was a problem. this is my code:

<html> <body> <form> <p>13-7: <input id="in1" type="text"" /><input type="submit" onclick="check(6, 'in1', 'out1')" value="Tjek!"/></p> <p id="out1"></p> <p>20-7: <input id="in2" type="text"" /><input type="submit" onclick="check(13, 'in2', 'out2')" value="Tjek!" /></p> <p id="out2"></p> <script type="text/javascript"> function check(facit, input, output) { var answer, evaluation; answer = document.getElementById(input).value; evaluation = (answer == facit) ? "Correct" : "Wrong"; document.getElementById(output).innerHTML = evaluation; return false; } </script> </form> </body> </html>

When I press the submit button, right / wrong is only displayed momentarily. I want him to stay on the site, any tips?

+4
source share
6 answers

Submit buttons submit your form (to reload your page).

Change the buttons to type="button" .

+10
source

Your buttons represent submit buttons ( <input type="submit"> ), so they will submit a form and refresh the page each time they are clicked. Instead, change your buttons to <input type="button"> .

+2
source

Change the onclick function to:

 onclick="check(13, 'in2', 'out2')"

in

 onclick="return check(13, 'in2', 'out2')"

Alternatively, if you do not want the form to be submitted, since you have two submit buttons, it is better to use:

 <input type="button" />
+2
source

Just change onclick from this

 onclick="check(6, 'in1', 'out1')"

to

 onclick="check(6, 'in1', 'out1'); return false;"

Do the same for the other.

Remove return false; in the check function.

Contact LIVE DEMO

+1
source

The form is submitted and returned with the original page.

What do you want to do?

 I dont want it returned with the original page .. I want it to say 'correct' og 'wrong' below the input

If you do not want to send data, then do as minitech suggests, change the type from sending to the button.

If you want to save the data, you will need to write code on the server side, and then create html with these values ​​populated (on the server side.)

0
source 
 <html> <body> <h1>What Can JavaScript Do?</h1> <p id="demo">JavaScript can change the style of an HTML element.</p> <input type="button" id="click me" value="clickme" onClick="action();" /> <script> var hidden = false; function action() { hidden = !hidden; if(hidden) { document.getElementById('demo').style.visibility = 'hidden'; } else { document.getElementById('demo').style.visibility = 'visible'; } } </script> </body> </html>
0
source

More articles:


All Articles