使用jQuery，我們是否可以通過「點擊」或「提交」來捕獲提交按鈕的事件？

Question

在jQuery中，對錶單提交按鈕或圖像，我們似乎可以使用

$('#search-box-submit').click(function() { 
     if ($('#search-box-submit').val().match(/^\s*$/)) { 
     alert("Please enter search keywords"); 
     return false; // stop the search request 
     } 
    }); 

，或者我們可以使用submit：

$('#search-box-submit').submit(function() { 
     if ($('#search-box-submit').val().match(/^\s*$/)) { 
     alert("Please enter search keywords"); 
     return false; // stop the search request 
     } 
    }); 

更新：實際上，click致力於預防一個空的關鍵字用於搜索，但submit並不妨礙這一點。這是爲什麼？

更新2：我在Firefox或Chrome如此驚訝，定義按輸入什麼也沒有進入爲好click處理實際工作。因此，看起來像Firefox和Chrome的智能英寸。如果我使用IE 8，那麼它將繼續前進和空字符串搜索（請求服務器）

Answer 1

您正在比較兩個元素的兩個不同事件。點擊事件是針對按鈕的，提交事件是針對表單的。在點擊內部返回false阻止表單被提交的原因是表單從未被通知過點擊事件。你會想要使用提交。

Answer 2

submit是你應該使用的。 click只會在您點擊時點擊按鈕。但是，還有其他方式可以提交表格（例如按下表格字段之一輸入）。

中查看以下有關返回false和防止默認事件： Submit behavior is acting differently when pressing a button compared to pressing enter

從您的更新，submit應綁定到窗體，而不是提交按鈕。

Answer 3

一眼看來，你看起來像你設置提交處理程序的錯誤元素。

在捕獲表單提交這樣的，它通常最好趕在實際提交事件，而不是提交按鈕的單擊事件，因爲不是所有的瀏覽器，當用戶按下輸入模擬點擊事件。

但是，提交事件僅適用於表單本身，而不適用於提交按鈕。我不確定你的HTML是如何設置的，但這是我要做的，希望你可以很容易地適應你的情況。

<!-- HTML --> 
<form id="search-box" action="/search"> 
    <label>Search: <input name="q"></label> 
    <button type="submit">Go</button> 
</form> 

// Javascript 
$("#search-box").submit(function(event) { 
    if ($("input", this).val().match(/^\s*$/)) { 
     alert("Please enter search keywords"); 
     event.preventDefault(); 
    } 
});