如何使IE8/9提交输入类型="文件"当javascript触发对话框打开

我一直在为同样的问题而挣扎，但我还没有找到一个干净的解决方案。

然而，我发现了一个解决方法。请注意，下面的解决方案完全无视最佳实践(以我个人的拙见)，如果有人有更好、更符合标准的方法，请在这里发布。

修复按钮点击事件

经过大量的研究，似乎很多人都在使用一种技巧，即他们绝对位置的<input type="file" />立即在他们的按钮，并设置不透明度为零。这意味着，对用户来说，看起来他们是在点击一个按钮，但浏览器认为它是在点击<input type="file" />(从而避免了IE中提到的问题)。我很惊讶地发现Quirksmode实际上推荐了这种方法。

修复按钮样式

现在，这确实引入了进一步的外观问题;你可能会发现你的按钮不再触发它们的:hover和:active CSS伪类(除非你把<input type="file" />放在按钮内)，并且你的鼠标光标可能会是默认的鼠标光标，尽管你已经应用了任何CSS到你的<input type="file" />或你的按钮。

这些类很容易通过JavaScript解决(我将把这个问题留给您)来修复，但是光标仍然是一个问题。奇怪的是，你可以将cursor样式设置在<input type="file" '>右侧的path，但这不会影响它的Browse按钮。不幸的是，这个(现在是透明的)按钮可能会在您的样式按钮的某些部分，导致默认光标悬停。

为了解决这个问题，我偶然发现了这个解决方法(JSFiddle在这里)。基本上，有人已经将事件绑定到按钮的mousemove事件，并且每次将鼠标悬停在按钮上时，都将<input type="file" />的右侧定位在鼠标光标下方。如果按钮没有固定的大小和overflow: hidden设置，为了阻止<input type="file" />从按钮的坐标外部被点击，这可能还需要增强一点。 结论

总的来说，我发现样式化<input type="file" />是不值得的;有太多的技巧，如果你真的想让它看起来很好，你可能不得不在某些时候使用JavaScript(如果你试图支持那些禁用JavaScript的人，那就不太好了)。我也不知道这对手机有什么影响。

如果你的目标是支持Html5文件API的新浏览器，实现AJAX拖放上传解决方案(这里是一个不错的解决方案)，并完全摆脱<input type="file" />。对于那些不支持它的浏览器(旧浏览器和禁用JavaScript的浏览器)，只需将未样式的<input type="file" />留在那里作为备用。

我发现使用jquery的fileupload扩展只是更好。它处理复杂的东西要比我手工做的好得多。它基本上做了jquery在x-browser中的dom操作&