按鍵不被稱爲已經隱藏jQuery UI模式框後隱藏

我有一個包含表單的jQuery UI模式框。按鍵不被稱爲已經隱藏jQuery UI模式框後隱藏

我聲明瞭keypress事件來處理Enter被按下。如果我隱藏模態框中包含的表單，則不會再調用按鍵事件。

這種行爲在這裏重現：https://jsfiddle.net/patrick29/jqp4wp77/

$('.dialog').on('keypress', function(e) { 
    if (e.keyCode == $.ui.keyCode.ENTER) { 
     submit(); 
    } 
}); 
function submit() { 
    alert('ok'); 
    $('.dialog form').hide(); 
}

第一次按下回車鍵我收到OK消息。然後窗體被隱藏，第二次按下Enter鍵我不再收到ok消息。

你知道我爲什麼以及如何隱藏表單並仍然有按鍵事件的工作嗎？

謝謝！

來源

2016-03-27 user2708647

如果它是隱藏的，怎麼能有重點，以便您可以按裏面的鑰匙？ –

確定按鈕是沒有隱藏的模式框之一，所以我預計隱藏窗體不會改變模式框上的按鍵事件管理 – user2708647

你可以做這樣的事情而不是.hide（）;

$('.dialog form').css({ 
    opacity: 0 
});

https://jsfiddle.net/nr5fptd2/1/

來源

2016-03-27 18:31:30

它的工作原理，但我希望空間佔用的形式消失，而不是設置不透明度爲0的情況下 – user2708647

function submit（）{警報（ 'OK'）; （'。dialog'）。css（{0，0，0，0，0，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，，， } –

由於我沒有找到任何干淨的解決方案，我使用了一個靈感來自你的函數的解決方法submit（）{alert（'ok'）; $（ '對話'），CSS（{ '位置'： '絕對'， '左'： ' - 500像素'}）; }'謝謝 – user2708647

要在容器上有一個按鍵處理程序，您需要在一個支持鍵盤交互的元素（如輸入）中有內容。一旦你隱藏表單，.dialog div裏面沒有任何元素支持。更多的信息在這裏：http://www.456bereastreet.com/archive/201302/making_elements_keyboard_focusable_and_clickable/

在你的提交函數中添加$('.dialog').append('<input/>');，例如，將使事件工作。當然，我不推薦它。

來源

2016-03-27 18:16:55

我試着添加$（'。dialog'）。append（''） ;在我的提交功能，但結果是相同的（按鍵事件不處理後，表格被刪除） – user2708647

按鍵不被稱爲已經隱藏jQuery UI模式框後隱藏

回答

相關問題