Javascript/Jquery -检测按键，除非文件选择对话框显示

Javascript/Jquery - Detect keypress except when file select dialog is showing

本文关键字：文件 选择 显示 对话框 Jquery 检测 Javascript      更新时间：2023-09-26

我有一个模态框覆盖，用户可以在其中编辑一些信息。关闭这个叠加的方法之一是按ESC键。我对这个工作没有问题。但是，在这个模态框中有一个用于上传文件的部分。当用户选择文件时，如果用户按ESC，则关闭"选择文件"对话框，但随后该按键也被我的"模态框关闭"脚本检测到。我确实有一个确认对话框来询问用户是否确定他们想要关闭这个框，但我仍然不希望这个动作被触发，如果他们只是试图关闭'file select'对话框。

这里最好的方法是什么?是否有一种方法来确定浏览器的焦点是否在"文件选择"对话框与实际页面的一部分?

更新:前三个答案基本上是一样的，而且答案很简单，我都不好意思问了。谢谢你的帮助。通常我会接受一个答案，但由于这三个是相同的，我真的不知道如何选择一个最喜欢的。我想我就选一个吧。不过，这并不影响另外两个的可接受性。谢谢大家。

这里最好的方法是什么?有办法确定吗浏览器的焦点是否在"文件选择"对话框上实际页面的?

为什么把它弄得那么复杂，你有能力识别用户是否点击了"选择文件"按钮，所以你可以设置一个标志变量，并在他们点击这个按钮时将其设置为true。

然后你的keydown/keyup事件可以检查标志并相应地处理场景。

编辑:

示例代码:

var SelectFileCode = {
   IsSelectingFile: false,
   Click: function() {
      this.IsSelectingFile = true;
      //do stuff here to open dialog
   },
   KeyDown: function(event) {
     if (this.IsSelectingFile && event.which == 27) //pressed ESC
        //don't close modal, just close select dialog
   }
};
$(function() {
    $('.selectBtn').click(SelectFileCode.Click);
    $('.modal').keydown(SelectFileCode.KeyDown);
});

您需要确保适当地重置IsSelectingFile，但这将是一般的方法。

设置对话框打开时的标志变量为true。当对话框关闭时，将其更改为false。

您可以在按下browse for file按钮时设置一个变量(标志)。之后在关闭模态框的地方，只需检查标志，如果它是on，就不要关闭该框。

相关文章：