处理一个非常奇怪的gChrome/Javascript问题

Question

我正在开发一个Chrome扩展程序，其中我需要通过jQuery在JavaScript中点击<input type='file' />来显示“另存为”对话框。是的，我已经被告知 - 大多数浏览器不允许您这样做。但是，我发现了一个非常奇怪的事情 - 如果我通过地址栏点击文件输入元素（并弹出保存对话框），那么我就可以做到这一点：

javascript: $("<input type='file' />").appendTo("body").click();

因此，我认为如果我能在那里做到这一点，那么肯定可以从我的内容脚本中实现...

显然我错了。 从我的内容脚本运行$("<input type='file' />").appendTo("body").click();不仅除了附加元素外什么也没做，甚至模拟地址栏并执行window.location = "javascript: $(\"<input type='file' />\").appendTo(\"body\").focus().click();";同样什么也没做。

我的初步想法是，也许这是某种Chrome限制在内容脚本中，但我错了-通过内容脚本工作的扩展程序jsShell能够运行命令并毫不费力地获取所需的结果。

那么，有人知道为什么jsShell和浏览器可以单击文件输入框并获取保存对话框，但我的扩展程序却不能吗？ 我已经尝试拆开jsShell并理解它的工作方式（尽管我没有看到它的特殊之处），但它仍然没有起作用。 而且控制台也没有显示任何东西-没有错误，也没有警告。

这让我的头昏脑胀，所以非常感谢任何帮助！

- mattsven

---

类似的问题：https://dev59.com/kXI-5IYBdhLWcg3wfoW1 和 https://dev59.com/hU3Sa4cB1Zd3GeqPwZd3 - Chris Shouts

Answer 1

不确定问题的根源是什么，但我设法缩小了范围，也许这对你有帮助。

似乎只有在其他事件内触发时才会触发单击事件。例如，这样可以正常工作：

$("body").mouseover(test);

function test() {
    $("<input type='file' />").appendTo("body").click();
}

这也可以运行：

$("body").append($("<a/>").text("test").click(test));

但这个不行：

$("body").append($("<a/>").text("test").click(function(){
    setTimeout(test,1000);
}));

Jsshell 在按钮点击时对您的脚本进行评估，因此只有在按钮点击时才能正常工作。如果您尝试在没有按钮点击的情况下评估此脚本，则无法正常工作。

我猜这是一种安全功能，只允许在用户执行某些操作时触发事件，而不是从某些后台进程中触发。

- serg

---

等一下...糟糕，这意味着我仍然不能做我想做的事情...也就是说，我不能在没有用户交互的情况下点击文件输入吗？ - mattsven

@motionman95 我有点修改了我的代码，body.click 不是一个好的例子。呃，我不知道你想做什么。如果用户没有点击某个按钮或移动鼠标来显示这个对话框，那么它可能无法工作（如果这就是我所认为的）。 - serg

我不认为他测试过，但无论如何，我相信他得出的结论是正确的。 - mattsven

@motionman95 我测试过了，它可以正常工作，那些斜杠只是其他测试代码的残留物（保留它们不会影响任何事情）。 - serg