Question

我正在尝试创建一个非常简单的模式对话框，只显示一个textarea。

目标：

如果用户点击“esc”键，它将消失（并忽略文本输入）
如果用户输入文本并点击“输入”键，则运行一个输入输入的函数（称为“postText（userinput）”）

我想知道我是否可以使用jQuery BlockUI：http://malsup.com/jquery/block/#demos。

但是，我不确定如何实际关闭基于esc的对话框，或者如果用户点击进入则运行一个函数。

任何帮助将不胜感激！

Answer 1

关闭ESC上的对话框，只需向keyup添加document听众，如果密钥代码等于$.unblockUI，则致电27。

$(document).on('keyup', function(e) {
  if (e.which === 27) { // Escape key
    $.unblockUI();
  }
});

对于表单，只需在对话框的输入字段中添加一个事件监听器即可。它基本相同。

$('#the-input').on('keyup', function(e) {
  if (e.which === 13) { // Enter key
    // AJAX maybe?
    $.post('your/url', { data: $(this).val() }, function(response) {
      $.unblockUI();            
    });
  }
});

修改

在加载DOM后分配这些侦听器。因此，您加载的脚本文件将包含：

$(document).ready(function() { // Code from the two listings above here // Trigger blockUI by click on an link for example $('a').on('click', function(e) { e.preventDefault(); $.blockUI({ message: $('#your-form') }); }); });

Answer 2

尝试这样的事情;

$('#txtValue').keyup(function(e) {
    e.preventDefault();

    if (e.keyCode === 13) {
        // The Enter key was pressed
        postText($(this).val());   
    }
});

您应该如何使用form.submit事件而不是侦听enter密钥。

if (e.keyCode === 27) {
    // The Esc key was pressed
    $('#dialog').hide();
}

另见这些以获取更多信息;

https://stackoverflow.com/search?q=javascript+esc+key

https://stackoverflow.com/search?q=javascript+enter+key

Answer 3

的javascript：

("#yourInput").keyup(function(e){
    switch (e.keyCode) {
    case 13: # enter
    # logic
    case 27: # esc
    # logic
    }
})

jQuery BlockUI：用户点击“enter”键后是否可以运行一个函数？

3 个答案: