2017-03-01 191 views
1

我正在創建一個登錄表單,如果有任何輸入錯誤,那麼我想留在同一頁面並通知客戶端輸入正確的輸入 我想要留在此頁面http://localhost:8080/loginpage/,但每次點擊後我都會重定向到http://localhost:8080/loginpage/?UserName=UserName&pword=&ConfirmPassword=&Email=Email&FirstName=First+Name&LastName=Last+Name&cars=male&Signup=Signup如何在點擊提交按鈕後留在同一頁面

我已經寫了一個代碼,但它似乎並沒有工作。

if(t!==0) 
{ 
    var er="Email-id already exists"; 
    window.location.reload(false); 
    document.getElementById("nemail").value=er; 
    document.getElementById("username").value=username; 
    document.getElementById("pword").value=""; 
    document.getElementById("confpwd").value=""; 
    document.getElementById("fname").value=fname; 
    document.getElementById("lname").value=lname; 
    document.getElementById("gender").value=gender; 
} 

我曾嘗試使用其他幾種方法,如

window.location.replace('/loginpage/'); 

window.location.href="/loginpage/index.html"; 

但他們沒有工作。 請幫忙!

回答

1

有兩種方法可以阻止表單提交。

  1. 設置表格onsubmit="return false"
  2. 註冊一個提交事件來自。在回調呼叫event.preventDefault();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<h2>1 way to prevent form to submit via onclick attribute</h2> 
 
<form action="#submit-from-1-way" onsubmit="return validate(this)"><!--set onsubmit="return false"--> 
 
    <input name="value"/> 
 
    <button type="submit">Submit</button> 
 
</form> 
 

 
<h2>2 way to prevent form to submit via submit event</h2> 
 
<form id="form" action="#submit-from-2-way"><!--set onsubmit="return false"--> 
 
    <input name="value"/> 
 
    <button type="submit">Submit</button> 
 
</form> 
 

 

 
<script> 
 
    console.log(location.href+'#'+location.hash+'?'+location.search); 
 
    function validate(form) { 
 
     return $(form).find('input').val(); 
 
    } 
 
    
 
    $('#form').submit(function (e) { 
 
     if (!validate(this)) e.preventDefault(); 
 
    }); 
 
</script>

+0

但我也有提示客戶輸入正確input.Then我將如何做that.Only在這種情況下,我想留在同樣的頁面 – aeshna

+0

請稍候,我會編輯我的答案 –

+0

event.preventdefault()工作。謝謝 – aeshna

0

您可以在點擊事件中使用的preventDefault()對於一個給定的HTML對象。這將阻止瀏覽器對特定的HTML對象採取默認操作。

例如防止actoin一個鏈接:

<body> 
<a href="http://www.google.com" id="clickMe">Click Me</a> 
<script> 

function dontGo(event) { 
    event.preventDefault(); 
} 

document.getElementById("clickMe").addEventListener("click",dontGo); 

</script> 

</body> 
+0

非常感謝。 event.preventDefault()工作。 – aeshna