+ 2

Why does it show blank white after button work

Here is my code, please run the code amd see the problem. After i click the button it shows what i want but after that it goes to blank page <!DOCTYPE html> <html> <head> <title>Page Title</title> </head> <body> <div class="box" id= "topbar"> <h1 id="main-name">SOCIAL MEDIA</h1> </div> <div class="box" id= "body"> <form> <input type= "text" id= "post"> <button onclick="submit()">submit</button> </form> <li style= "color:white;">hello</li> </div> <script type=text/javascript> function submit() { var posttext= document.getElementById("post").value; alert(posttext) } </script> </body> </html>

javascrip htm

1st Jun 2020, 3:00 PM

Asef Dian🇧🇩

7 Answers

+ 5

Set button type attribute as "button" <button type="button" onclick="greet()">Click</button> Don't name your JS function "submit", it calls for form submission (unsupported in SoloLearn).

1st Jun 2020, 3:22 PM

Ipang

+ 3

Ipang My sincere apologies - I had never heard that before. Thanks for teaching me something new! 👍

1st Jun 2020, 4:29 PM

Russ

+ 2

Ipang type="button" is for <input> tag - not necessary for <button> 😉

1st Jun 2020, 3:29 PM

Russ

+ 2

Russ The default value for button "type" attribute is 'submit', it is recommended to set the button's "type" attribute value as 'button' when we wish to link the button with JS. It is not necessary when a button is expected to function or behave similar to a <input> with "type" attribute set as 'submit' 😁 https://dev.to/clairecodes/why-its-important-to-give-your-html-button-a-type-58k9 https://html.com/attributes/button-type/ (Edited)

1st Jun 2020, 4:21 PM

Ipang

+ 1

Russ I also learned from your answers brother, no apologies was even needed 🤗

1st Jun 2020, 4:37 PM

Ipang

Because you are submitting the form for which you need php or any serverside handler.

1st Jun 2020, 3:22 PM

Prabhakar Rai