截获的Javascript“;Ctrl+;O";不打开“我的文件”对话框

截获的Javascript“;Ctrl+;O";不打开“我的文件”对话框,javascript,jquery,html,dialog,Javascript,Jquery,Html,Dialog,我的HTML中有一个文件浏览器输入 我还有一个ID为choosefilebutton的按钮,单击该按钮时,会调用document.getElementById(“浏览按钮”).click()。单击此按钮时,它会正确单击#浏览按钮,并打开文件对话框 现在,我从中获取代码,截取一个Ctrl+O按键并打开我的文件对话框,因此我有以下内容: $(window).bind('keydown', function(e) { if (e.ctrlKey || e.metaKey) {

我的HTML中有一个
文件浏览器输入

我还有一个ID为
choosefilebutton
的按钮,单击该按钮时,会调用
document.getElementById(“浏览按钮”).click()。单击此按钮时,它会正确单击
#浏览按钮
,并打开文件对话框

现在,我从中获取代码,截取一个
Ctrl+O
按键并打开我的文件对话框,因此我有以下内容:

$(window).bind('keydown', function(e)
{
    if (e.ctrlKey || e.metaKey)
    {
        switch (String.fromCharCode(e.which).toLowerCase())
        {
            case 's':
                e.preventDefault();
                // doesn't matter for this question
                return false;
            case 'o':
                e.preventDefault();
                document.getElementById("choose-file-button").click();
                return false;
        }
    }
    return true;
});
如您所见,当我截取
Ctrl+O
时,我单击我的
#选择文件按钮
按钮,该按钮调用
document.getElementById(“浏览按钮”)在其
onclick
处理程序中。我在这个点击处理程序中放置了一个断点,当我按下
Ctrl+O
时,它确实到达了这个断点。但是,“文件”对话框从未显示

通过调试,我发现如果我放一个
警报(…)
#选择文件按钮点击()行之后,警报显示正常页面“打开文件”对话框显示(不是我的文件对话框)。但是,如果我没有此警报,则不会显示任何内容

这是虫子吗?如何修复它并通过截获的
Ctrl+O
显示我的文件对话框


编辑:我刚刚在Chrome上进行了测试,效果非常好。但是,它在Firefox中仍然不起作用。

这里有一些浏览器安全魔法。当使用超时、间隔或我尝试的任何其他方法时,代码正常运行,但浏览器只是拒绝打开文件上载对话框。这可能是故意的,以阻止恶意JS在未经同意的情况下试图抓取用户的文件。但是,如果您绑定到链接上的单击事件,那么使用jQuery或常规JS可以完美地工作

编辑:正如所怀疑的那样,大多数浏览器根据事件的类型以及事件是由用户创建的还是通过编程生成的来跟踪事件是否可信。有关详细信息,请参阅。如您所见,由于键盘事件不在列表中,因此它们永远不可信


$(“#mylink”)。单击(函数(){
$(“#我的文件”)。单击();
});
$(窗口).bind('keydown',函数(e){
if(e.ctrlKey | | e.metaKey){
开关(String.fromCharCode(e.which.toLowerCase()){
案例“o”:
e、 预防默认值();
控制台日志(“1a”);
$(“#我的文件”)。单击();
//警惕(“你好”);
控制台日志(“1b”);
返回false;
}
}
返回true;
});
我认为这里只有两种选择,它们都是解决办法,而不是解决方案

  • 一种是使用链接触发文件上传对话框,并要求人们使用ALT+SHIFT+O而不是CTRL+O(因为我在示例中向链接添加了一个)
  • 另一种选择是使用一种新的HTML5JavaScript API来实现

附录:我还尝试在Firefox中使用纯JavaScript抓取一个点击事件,并使用
isTrusted
属性检查它是否可信。对于点击链接,它返回
true
。但是,尝试在其他地方存储和重用事件是行不通的,因为在您获得对它的引用时,它已经被调度。此外,毫不奇怪,创建一个新事件并尝试设置
isTrusted=true
也不起作用,因为它是只读的。

浏览器将许多Ctrl+快捷键映射到自己的命令,例如Ctrl+O以打开文件(在firefox中)

同时,当您试图在javascript中覆盖这些快捷方式时,浏览器的行为会有所不同。有些浏览器允许您这样做,有些不允许,有时默认浏览器操作可能会与javascript操作一起弹出

下面是另一个讨论这个问题的帖子


您最好选择其他快捷方式。

您可以使用捕鼠器库进行尝试。它覆盖了密钥捕获带来的大多数问题。 官方网站和完整参考资料:


祝你好运

你不能在所有浏览器中都这么做,就我而言,只有IE允许这样做。我猜这是因为安全问题,所以程序员被禁止在HTML文件元素上自动设置文件名(未经客户端许可)

有关更多详细信息,请查看此链接:


您是否尝试过使用JQuery以
$(“#选择文件按钮”)触发您的单击。单击()
而不是使用getElementById?@Osuwariboy我现在有了,但它没有改变任何东西。您的问题似乎与此类似:。也许你可以试试他们的一些建议?@Osuwariboy当然可以,但我根本不想要任何警报,即使是延迟警报。你的上限锁定了吗?这里要澄清的是,OP想要覆盖组合键Ctrl+O,而不是设置点击事件,这对于实现来说是微不足道的。捕鼠器库不是要设置点击事件,而是为了避免使用鼠标,所有这些都是通过键盘实现的。啊哈。。。我懂了。这是一个不错的实用程序,但由于我在回答中提到的问题,没有JS库可以绕过浏览器的安全防范措施。我用小提琴试过了。@guest271314链接不错!我非常怀疑浏览器能区分真正的点击和程序性点击。@BoffinbraiN感谢您的详细回复,很抱歉我没有在这里提前提问/给出答案/投票。。。我不在城里。不管怎样,我可能会查看HTML5API,但如果它看起来太难使用,我只会坚持不使用文件IO的键盘快捷键(因为网页上仍然有可以正常工作的按钮)。
<form action="#" method="post">
    <div>
        <input type="file" id="myfile" name="myfile" /> <a href="#" id="mylink" accesskey="o">Click me</a>
    </div>
</form>

$("#mylink").click(function () {
    $("#myfile").click();
});

$(window).bind('keydown', function (e) {
    if (e.ctrlKey || e.metaKey) {
        switch (String.fromCharCode(e.which).toLowerCase()) {
            case 'o':
                e.preventDefault();
                console.log("1a");

                $("#myfile").click();
                //alert("hello");

                console.log("1b");
                return false;
        }
    }
    return true;
});