正しい値を入力するとWebページが再読み込みされます

Question

私は奇妙な問題に遭遇しました。私はOKのための"00000"のような応答コードを返すPHPページにデータを送信するログインページを作成しました。私はPostmanツールで私のサーバをテストし、サーバが完全にうまく動作していることを発見しました。私のhtmlサーバーサーバーにデータを送信するときに応答コードで応答します。応答コードが間違っていたら、htmlで警告します。 しかし、正しい資格情報を入力し、サーバーが正常に応答すると、ログインページは何の理由もなくリロードされます。 は、ここに私のjavascript

function validatelog(){ 
var user_email_log=document.getElementById("user_email_log").value; 
var user_pass_log=document.getElementById("user_pass_log").value; 
if (user_email_log&&user_pass_log!=null) 
{ 
      var hr = new XMLHttpRequest(); 
      var url = "../logic/login.php"; 
      var vars = 
"user_email_log="+user_email_log+"&user_pass_log="+user_pass_log; 
      hr.open("POST", url, true); 
      hr.setRequestHeader("Content-type", "application/x-www-form- 
urlencoded"); 
      hr.onreadystatechange = function() { 
      if(hr.readyState == 4 && hr.status == 200) { 
       var saman = hr.responseText.trim(); 
       if(saman=="00000"){ 
        alert(saman); 
       }else if (saman == "404"){ 
        alert("Failed with 404"); 
       } 

       else{ 
        alert(saman); 
       } 
       } 
      } 
      hr.send(vars); 
     } 
    } 

だと、私のHTMLは、ボタンにtype="button"を追加し、この

<input id="user_email_log"/> 
<input id="user_pass_log"/> 
<button onclick="validatelog();">Log in</button> 

Answer 1

次のようになります。

それが指定されていない

<button type="button" onclick="validatelog();">Log in</button> 

、それはtype="submit"と同じですこれによりページがリロードされます。

Answer 2

jqueryを使用している場合は、これを行うことができます。

$(document).on('click', 'button', function(e) { 
    e.preventDefault(); 
    $.get('url') 
}) 

これはデフォルトの動作であるため、ページがリロードされていると思います。