在输入字段中选择文件后浏览器冻结答案

【问题标题】：Browser freezing after selecting file in input field在输入字段中选择文件后浏览器冻结
【发布时间】：2017-02-20 18:06:14
【问题描述】：

我有一个包含输入文件字段 [<input type="file" id="select-file" accept=".md"><label for="select-file">Select import file</label>] 的表单。它为更改事件 [$("#form").on("change", "#select-file", handler)] 定义了一个 jQuery 处理程序，以便在我选择文件后立即触发。

它在使用 Firefox 的 Linux work 和 home 使用 Firefox 和 Chrome 的 Windows 上完美运行。

在使用 Chrome 或 Firefox 的 Windows 工作时，浏览器会在选择文件后冻结大约 8 秒。只有在此中断之后，我才能按下表单上的其他按钮并触发“更改”事件。

放弃 Windows 和工作不啮合的假设，冻结似乎与工作中可用的不同网络磁盘有关。谁能建议我必须检查什么，并希望有一种方法可以避免冻结？谢谢！

小例子：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>File Select</title>
    <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
</head>
<body>
<div id="import-form">
    <input type="file" id="select-file" accept=".md">
    <label for="select-file">Select a file</label>
    <p id="selected-file">No file selected</p>
</div>
<script>
$("#import-form").on("change", "#select-file", function(e) {
    $("#selected-file").text(e.target.value.split('\\').pop());
});
</script>
</body>
</html>

【问题讨论】：

选中的File的.size是什么？
完全没有风格。即使使用准系统元素也会发生这种情况（我将在我的问题中添加一个简短的示例）
没有引用style 属性，而是引用了选定.files[0] 对象的File.size。也就是选中的文件的文件大小是多少？
时至今日，我仍然为这个问题所困扰。有时在选择文件后会立即触发更改回调。其他时候最多需要 5 秒。如果我单击浏览器窗口上的任意位置，我会听到窗口提示音。 Facebook 文件上传器可以完美运行，不过...
无法比@StinkyCat 更好地描述这个错误。在 Chrome 66 和 Firefox 60 中也是如此。令人惊讶的是，Internet Explorer 11 没有问题。（在我的 Windows 7 上都使用小文本文件进行了测试。）

标签： javascript jquery performance google-chrome firefox

【解决方案1】：

在使用文件字段后，Chrome 会冻结几秒钟。

这是因为我在 Windows 资源管理器的“快速访问”菜单中有一个快捷方式。此快捷方式已与网络共享的文件夹链接。我已经删除了这个快捷方式，现在一切都很好。

【讨论】：

同样，我有一个映射的网络驱动器没有响应，这会延迟 5 秒。取消映射驱动器后，不再有延迟。 firefox 或者 chrome 的延迟是一样的，不知道是不是windows的问题
这里也一样，如果要删除它，在 Windows 10 上，单击图标快速访问（蓝星），然后右键单击出现在“常用文件夹”面板中的死链接右侧面板，然后选择“取消固定/从快速访问中删除”。应该没有错误信息。