Javascript 如何识别文件输入已打开窗口_Javascript_Jquery

Javascript 如何识别文件输入已打开窗口

javascript jquery

Javascript 如何识别文件输入已打开窗口,javascript,jquery,Javascript,Jquery,我有一个在用户按下esc按钮时运行的功能：我有一个带有文件字段的表单 <input type="file" /> 单击它时，会打开一个文件管理器对话框，也可以使用esc关闭该对话框。在这种情况下，我希望避免运行foo函数。有没有办法用javascript识别它？以下是一些代码，可以在一个完整的测试页面上实现您想要的功能： <!DOCTYPE html> <html> <head> <meta charset="UTF-8" />

我有一个在用户按下esc按钮时运行的功能：

我有一个带有文件字段的表单

<input type="file" />

单击它时，会打开一个文件管理器对话框，也可以使用esc关闭该对话框。在这种情况下，我希望避免运行foo函数。有没有办法用javascript识别它？

以下是一些代码，可以在一个完整的测试页面上实现您想要的功能：

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8" />
  <title>test-page</title>
 <script type="text/javascript">
//<!--
var ignr=false;

function func(e)
{ if(!ignr)
  { //add any key-specific tests here
    foo();
  }
  ignr = false;
  return;
}

function foo()
{
  return;
}

function func2(e)
{ //Could add a condition to do/not-do the next line, depending on the key...
  ignr = true;
  return;
}
// -->
 </script>
</head>
<body onkeyup="func(event);">
<input type="file" onkeyup="func2(event);" />
</body>
</html>

诀窍是为输入标记分配不同的函数。这不会阻止调用另一个函数，但首先调用此处指定的func2，这样您就有机会设置一个标志变量，该变量可以控制在主onkeyup函数中执行的操作。注意，虽然我没有为转义键指定任何测试，但您当然可以添加它们，甚至可以完全控制希望通过func2在主onkeyup函数内调用foo的键。目前，在文件输入过程中按下的任何键都不可能调用foo。

它必须在keyup上运行吗？我怀疑按键或按键是否对您有效，但如果没有测试，我不知道在您描述的情况下两者都不会触发。如果通过单击角落中的X关闭对话框，会怎么样？@Rory我不认为这是问题所在-问题是当使用escape关闭对话框时，然后，该页面捕获对话框关闭后释放的密钥，而对话框不应该关闭。我不认为keydown或keypress会捕捉到这种情况situation@JamesThorpe我不确定。但我很感兴趣-为什么按键会有什么不同？@yuvi因为按键向下的部分会发生在对话框上，而不是页面上-就像你把焦点放在另一个窗口上一样，按下escape down，切换到你的页面，然后释放它

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8" />
  <title>test-page</title>
 <script type="text/javascript">
//<!--
var ignr=false;

function func(e)
{ if(!ignr)
  { //add any key-specific tests here
    foo();
  }
  ignr = false;
  return;
}

function foo()
{
  return;
}

function func2(e)
{ //Could add a condition to do/not-do the next line, depending on the key...
  ignr = true;
  return;
}
// -->
 </script>
</head>
<body onkeyup="func(event);">
<input type="file" onkeyup="func2(event);" />
</body>
</html>