如何在沒有提交按鈕的情況下使用Enter鍵提交表單

我有jQuery去所有提交按鈕的類按鈕，然後使用類按鈕將它們轉換爲錨點元素。如何在沒有提交按鈕的情況下使用Enter鍵提交表單

$("input.button").each(function(i) { 

    var anchorButton = $("<a class='"+this.className+"' href='#'>"+this.value+"</a>") 



    anchorButton.click(function(eventObject) { 

     $(this).blur().prev("input.hidden").click(); 

     return false; 

    }); 



    $(this) 

     .after(anchorButton) 

     .addClass("hidden") 

     .removeClass("button pill-left pill-center pill-right"); 

});

然後，我可以使用CSS設置錨點元素的樣式，cross-browser-ly。只有一個問題。每當我按下表單輸入元素上的Enter鍵時，表單都不會提交。但是，如果我取消隱藏提交按鈕，它會再次運行。總之，除非我有一個可見的提交按鈕（display！= none），否則我無法獲得Enter/Return鍵提交表單。

隱藏提交按鈕時，如何在按Enter鍵時提交表單？

來源

2010-08-22 Sam

我可以爲什麼將表單的提交按鈕轉換爲錨？ – Ben 2010-08-22 19:43:30

我將輸入[type = submit]元素更改爲錨點的原因是我可以對它們進行樣式設計，並繞過Internet Explorer在按鈕元素上的怪癖。 – Sam 2010-08-22 20:00:08

$("input.button").keydown(function(event) { 
    if(event.keyCode == 13) 
     $("...find the form...").submit(); 
});

這應該工作。

如果不試試這個：

$("..find the input button you hide..").css('position', 'absolute') 
     .css('top', '-1000px');

這比所提出的解決方案，visibility: hidden，因爲如果你設定的能見度隱藏按鈕仍然會「佔用空間」更好。

來源

2010-08-22 19:39:01

好吧承認 - 雖然具體問題隱藏提交按鈕的問題:) – 2010-08-22 19:43:26

@Roopesh：問題是如何使表單提交按下回車鍵時*提交按鈕已被隱藏*。 – Stian 2010-08-22 19:51:20

確實可見性CSS屬性不合適。我已經有了當我按下錨元素時提交表單的代碼。我需要的是在input [type = text]元素上保持Enter鍵的默認行爲。我想我的解決方案是使用絕對定位，而不是顯示屬性。我會試一試。 – Sam 2010-08-22 19:56:47

-1

您是否嘗試將隱藏的可見性更改爲隱藏而不是顯示爲無？

來源

2010-08-22 19:35:42

即使我認爲應該工作 - 你打敗了我：D – 2010-08-22 19:38:21

-1

嘗試知名度=隱藏

來源

2010-08-22 19:37:19

只需在您的HTML中使用普通的form，包括提交action屬性。然後你會得到瀏覽器的默認行爲，並按輸入內的表單將提交它。然後，您不必使用jQuery將事件處理程序綁定到所有提交按鈕。

您可以使用此JSBin進行測試。

來源

2010-08-22 19:39:03

如何在沒有提交按鈕的情況下使用Enter鍵提交表單

回答

相關問題