在jQuery中組合多個選擇器

Question

我正在嘗試找到一種解決方案，以使此代碼更簡潔：

$(document).keypress(function(ev){
         if($("#dialog").is(':visible') === false && $("#alertDialog").is(':visible') === false){
            if(ev.keyCode=='13' && !$('#resetBtn').is(':focus') && !$('.edit-new').is(':focus') && !$('.edit-trash').is(':focus')){
                return validateForm('valueTable');
            } 
            if(ev.keyCode=='27'){
                $('#resetBtn').click();
            }
         }
     });

如您所見，我正在檢查執行事件之前是否沒有三個單獨的輸入。 有沒有一種方法可以將＃resetBtn，.edit-new，.edit-trash定向到一個打包好的選擇器中？

Answer 1

這會做你想要的嗎？

$('#resetBtn:focus, .edit-new:focus, .edit-trash:focus').length === 0

您也可以使用類似的語句進行可見性檢查。

Answer 2

是的，就像這樣$('#resetBtn, .edit-new, .edit-trash') :)

Answer 3

您可以使用單個選擇器，只需檢查它們返回的元素的長度即可。 當我們可以檢查length屬性時，沒有理由顯式地檢查是否為false ：

// Handle the keypress event on the document object
$(document).on("keypress", function (event) {
    // Proceed if no visible dialogs
    if (!$("#dialog:visible, #alertDialog:visible").length) {
        // Checking which key was pressed
        switch (event.which) {
            case 13:
                // If no focus is on #resetBtn, .edit-new, or .edit-trash
                if (!$("#resetBtn:focus, .edit-new:focus, .edit-trash:focus").length) {
                    return validateForm("valueTable");
                }
                break;
            case 27:
                // Trigger the click event on #resetBtn
                $("#resetBtn").trigger("click");
        }
    }
});