提交表單時阻止瀏覽器跳轉到首頁

我試圖防止用戶提交表單時頁面跳轉到頂部。有很多人建議return false。但是，它也阻止了表單提交。提交表單時阻止瀏覽器跳轉到首頁

我想知道是否有人可以幫助我。

**JQuery** 

$('#submit').click(function(){ //doesn't work 
    return false; 
}) 

$('form').submit(function(){ //doesn't work either 
    return false;  
}) 



**Html** 
<form...> 
<input>... 
<input>... 
<input>... 

<input type='submit' id='submit' value='submit'> 

</form>

來源

2012-03-08 FlyingCat

的形式提交回到同一頁面？ – nnnnnn 2012-03-08 03:42:25

你想要類似Ajax的功能嗎？ – Simon 2012-03-08 03:45:05

@nnnnnn不，表單會提交到另一個頁面，但我有表單驗證錯誤消息，如果表單失敗時彈出，當錯誤消息彈出時，頁面將跳轉到頂部。我希望頁面保持在原來的位置。謝謝。 – FlyingCat 2012-03-08 03:48:06

當您提交表單時，您正在有效地加載新頁面。在submit處理程序中返回false將簡單地告訴瀏覽器不要冒泡事件並且不執行默認事件，在這種情況下，它將提交表單，這就是爲什麼當您這樣做時沒有任何事情發生。

有幾種解決方案可以解決您的問題。如果您將用戶（在表單提交後）重定向回表單頁面，但出現錯誤，則可以在URL中包含「片段標識符」。讓片段標識符指向您的表單ID，瀏覽器將自動轉到文檔的該部分。例如：

<form id="my-form"> 
    ... 
</form>

以及您的網址是：

host/path?query=querystring#my-form

如果你想避免在重新加載頁面，嘗試做您的驗證在JS。 jQuery驗證插件非常易於使用，簡直太棒了。請參閱here以瞭解如何使用它。這很好，因爲它爲你提供了大部分重要的工作，並且有一套通用的默認驗證方法。

或者，您可以通過ajax提交表單並返回服務器撿到的任何驗證錯誤。如果你沒有任何錯誤，那麼你可以重定向到下一頁。如果有錯誤，請將其粘貼在表單中或顯示警報。此解決方案將避免您必須在客戶端上覆制任何複雜的驗證邏輯（如果您想使用jQuery validate插件）。

來源

2012-03-08 03:57:52 Simon

_「在提交處理程序中返回false只是告訴瀏覽器不要冒泡事件」_ - 返回false取消冒泡_and_取消默認動作（默認動作將提交） – nnnnnn 2012-03-08 03:59:47

是的，現在已修復 – Simon 2012-03-08 04:01:03

@Jerry，您最終使用了哪種解決方案？ – Simon 2012-03-08 04:15:35

嘗試在jQuery的使用preventDefault（）方法..

$('#submit').click(function(e){ 
    e.preventDefault(); 
});

來源

2012-03-08 05:33:11 Gopesh

謝謝。但它會阻止我的表單被提交。 +1雖然。 – FlyingCat 2012-03-08 14:25:34

提交表單時阻止瀏覽器跳轉到首頁

回答

相關問題