2012-08-22 54 views
1

我創建了一些函數來創建一個「是/否」確認窗口,其中包含用於確認來自用戶的響應的jQuery的彈出窗口。我已經生成了觸發功能的按鈕,具體取決於您點擊的內容。將keydown事件添加到包含動態內容的jQuery模態彈出窗口

//加載specailized彈出用於確認以局部方式 功能popupConfirm事(TitleKey,InstructionsKey,YesFunction,NoFunction){

//create the service to give us the content 
var agpc = new AjaxServices.AjaxPopUps(); 

//get the results and open the popup with the functions aligned 
agpc.GetLocalizedStrings(new Array(TitleKey, InstructionsKey, "Yes", "No"), function (results) { 
    var content = jQuery.parseJSON(results.toString()); 

    //get the buttons for confirm/or not 
    var YesNoButtons = jQuery('<div></div>', { id: 'YesNoButtons' }); 
    var yesButton = jQuery('<a>' + content.Yes + '</a>'); 
    var noButton = jQuery('<a>' + content.No + '</a>'); 

    //add the event handlers 
    yesButton.click(YesFunction); 
    noButton.click(NoFunction); 

    //set a nice pointer for mouse over 
    yesButton.css({ cursor: 'pointer' }); 
    noButton.css({ cursor: 'pointer' }); 

    YesNoButtons.append(yesButton).append(noButton); 
    //show the box 
    openPopup("Non-JSON", YesNoButtons, eval('content.' + TitleKey), eval('content.' + InstructionsKey)); 

    }); 
} 

那麼現在來的困難的部分。該公司也希望按鍵來觸發是/否功能。一個回車鍵應該觸發yes,escape應該觸發no。我沒有真正的想法,我將如何使用這種類型的設置來做到這一點。

您可以忽略那裏的大部分代碼。它是從服務器獲取本地化的字符串。它添加我無法弄清楚的keydown()事件。

任何想法?

回答

1

好吧,這不是很難做到,只是嘗試自定義調整和使用以下跨瀏覽器支持的代碼。

如果您需要捕捉事件鍵(按下鍵盤上的鍵),並做一些動作:

$("#YourDialog").keypress(function(event) { // when you do a key press inside of the element with ID YourDialog 
    var keyCode = event.keyCode ? event.keyCode : event.which; 
    if(event.keyCode == 13 || event.keyCode == 27) { // catching event for clicking either enter key or escape key. 
    $("#OkButton").trigger('click'); 
    // or $("#YourDialog").hide(); to hide your dialog. 
    } 
}); 

如果相反,你需要防止你必須使用該代碼的默認鍵動作:

$("#YourDialog").keypress(function(event) { // when you do a key press inside of the element with ID YourDialog 
    var keyCode = event.keyCode ? event.keyCode : event.which; 
    if(event.keyCode == 13 || event.keyCode == 27) { // catching event for clicking either enter key or escape key. 
    event.preventDefault(); // preventing the default action - so, in this case, when the enter or escape is pressed nothing will happen. Especially it's important when you want to prevent user from click some keys. 
    event.stopPropagation(); 
    } 
}); 

您必須捕獲用戶事件(被按下的鍵)。鍵碼13是指輸入鍵,鍵碼27是指換碼鍵。 keyCode變量可以普遍適用於所有瀏覽器,包括Internet Explorer。

請在這裏查看完整的keyCode List

我希望這會對你有用。

相關問題