2012-11-20 140 views
2

我有一個頁面,我有一個窗體,我附上一個jQuery事件處理程序,通過按下鍵盤上的回車鍵來提交此表單。在jquery上處理多個事件處理程序keypress

//Submit form when enter pressed 
$(document).keypress(function (e) { 
    if (e.which == 13) { 
     $('form').submit(); 
    } 
}); 

我也有可能在同一頁面上顯示使用jquery ui dialog()的模態。在模式(這是一個隱藏的直到對話框()被調用))有一個按鈕,我也想讓用戶能夠點擊按鈕,當他點擊鍵盤上的輸入。我遇到的問題是如果我在頁面上使用與先前相同的事件處理程序,它將同時提交表單並單擊該按鈕。

我該如何處理這個問題,以便第二個事件處理程序僅限於模態/不傳播到文檔的其餘部分?我試過e.stopPropagation,在這種情況下不起作用。

//Handler on the modal 
$(document).keypress(function(e) { 
    e.stopPropagation(); 
    if($('#button-doc-validate').is(':visible') && e.which == 13) { 
     //Click the button 
     $('#button-doc-validate').click(); 
    } 
}); 
+0

如果它是一個形式,爲什麼不使用提交表單的功能,而不是處理的按鍵? –

+0

那麼模式不是一種形式,我怎麼才能觸發提交事件,而不用聽按鍵,因爲我想能夠在按鍵上提交 –

+1

如果你用for提交表單(它將處理你的輸入鍵) ..然後你可以綁定你的模式上的按鍵事件處理程序來分離兩個不同的按鍵http://jsfiddle.net/KMAYv/ –

回答

1

如果使用的提交(這會爲你處理輸入按鍵)..然後你可以綁定在你的模式按鍵事件處理的兩種不同的按鍵

$('form').submit(function(){}) //- will handle enter keypress and form submit action 

$('modal').keypress(function(){}); //- will handle the keypress inside the modal 

所以分開處理您的形式進入按鍵將被分離

http://jsfiddle.net/KMAYv/

0

答案很簡單我中庸之道也沒弄明白這是可能的。

我剛剛綁定在模式的DIV的按鍵事件處理,而不是將它綁定到文檔:

//Handler on the modal 
$('#modal-container').keypress(function(e) { 
    if($('#button-doc-validate').is(':visible') && e.which == 13) { 
     //Click the button 
     $('#button-doc-validate').click(); 
     return false; 
    } 
}); 

這樣,它觸發僅在模式並取消傳播返回false,所以不影響更一般的文檔寬按鍵處理程序。