HTML提交功能只有一瞬間

Question

每當我點擊提交它做的功能，但只顯示它一秒鐘然後消失。對不起，我不能提供更多的細節，即時通訊仍然是新的HTML和JavaScript，所以我真的不明白什麼是錯的。

的JavaScript

function addtext() { 
     var user = document.login.user.value; 
     var pass = document.login.pass.value; 
     var email = document.login.email.value; 
     var phone = document.login.phone.value; 
     document.writeln("Thank you for taking time to visit us. We will contact you as soon as possible."); 
     document.writeln("<pre>"); 
     document.writeln("Welcome  : " + user + " The details you entered are as followed:"); 
     document.writeln("Username  : " + user); 
     document.writeln("Password  : " + pass); 
     document.writeln("Email Address : " + email); 
     document.writeln("Phone   : " + phone); 
    } 

HTML

<form name="login" method=post onsubmit="addtext()"> 

    <label for="user">Username</label> 
    <input type="text" name="user" placeholder="Username" pattern="^[A-Za-z0-9_]{1,15}$" title="15 maximum characters."> 
    <br> 
    <label for="pass">Password</label> 
    <input type="text" name="pass" placeholder="Password" pattern="(?=^.{6,9}$)((?=.*\d)|(?=.*\W+))(?![.\n])(?=.*[A-Z])(?=.*[a-z]).*$" title="Must have one upper case and one lower case. Minimum chars 6, Maximum Chars 9"> 
    <br> 
    <label for="email">Email Address</label> 
    <input type="text" name="email" placeholder="Email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$" title="Please enter a valid email address"> 
    <br> 
    <label for="phone">Phone</label> 
    <input type="text" name="phone" placeholder="Phone Number" pattern="[0-9]{1,}" title="Please enter a valid phone number(numbers 
    only)"> 
    <br> 
    <input type="submit"> 
</form> 

Answer 1

你必須在form一個submit按鈕，submit後會reload的頁面。

使用return false;

function addtext() { 
 
    var user = document.login.user.value; 
 
    var pass = document.login.pass.value; 
 
    var email = document.login.email.value; 
 
    var phone = document.login.phone.value; 
 
    document.writeln("Thank you for taking time to visit us. We will contact you as soon as possible."); 
 
    document.writeln("<pre>"); 
 
    document.writeln("Welcome  : " + user + " The details you entered are as followed:"); 
 
    document.writeln("Username  : " + user); 
 
    document.writeln("Password  : " + pass); 
 
    document.writeln("Email Address : " + email); 
 
    document.writeln("Phone   : " + phone); 
 
    return false; 
 
}

<form name="login" method=post onsubmit="return addtext()"> 
 

 
    <label for="user">Username</label> 
 
    <input type="text" name="user" placeholder="Username" pattern="^[A-Za-z0-9_]{1,15}$" title="15 maximum characters."> 
 
    <br> 
 
    <label for="pass">Password</label> 
 
    <input type="text" name="pass" placeholder="Password" pattern="(?=^.{6,9}$)((?=.*\d)|(?=.*\W+))(?![.\n])(?=.*[A-Z])(?=.*[a-z]).*$" title="Must have one upper case and one lower case. Minimum chars 6, Maximum Chars 9"> 
 
    <br> 
 
    <label for="email">Email Address</label> 
 
    <input type="text" name="email" placeholder="Email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$" title="Please enter a valid email address"> 
 
    <br> 
 
    <label for="phone">Phone</label> 
 
    <input type="text" name="phone" placeholder="Phone Number" pattern="[0-9]{1,}" title="Please enter a valid phone number(numbers 
 
    only)"> 
 
    <br> 
 
    <input type="submit"> 
 
</form>