Question

我正在使用jQuery和Andrew Valum's file uploader来处理表单中的ajax图像上传。当用户选择文件输入时，所需的行为是让文件立即上传到服务器。

html元素：

<input type="file" id="imgUpload" />

JS：

var uploader = new qq.FileUploaderBasic({
  button: $('#imgUpload')[0],
  //...
});

以上版本适用于Chrome和Safari，但不适用于Firefox。 Firefox处理JS的方式有什么不同吗？非常感谢。

编辑：虽然我不是javascript专家，但我认为Valum的文件上传器用自己的一个替换目标输入元素，然后它会附加一个onchange监听器来处理自定义ajax请求。这适用于Chrome。但是，在Firefox中，事件永远不会触发ajax请求。文件输入就像在普通的html表单中一样，并且需要表单提交。没有javascript错误或任何东西，所有其他脚本在所有浏览器中都可以正常工作。

更新：仍在努力。结果是qq.FileUploaderBasic正在初始化并且输入元素成功发送了“change”事件。它不会像在Chrome中一样触发FF中的事件处理程序。

Answer 1

原来这是一个CSS问题而不是Javascript问题。会发生什么是文件上载脚本在目标输入元素中创建 new <input type="file">元素。这个新的目标输入元素具有所需的更改事件处理程序。

在Chrome中，单击原始输入会激活新的输入元素，从而触发所需的行为。问题是，在Firefox中，单击原始输入会以某种方式激活原始输入元素而不是新元素。这就是问题的原因。

所以这更像是一个跨浏览器的CSS问题而不是Javascript问题。我的下一步是弄清楚如何让Firefox选择正确的元素，但是现在希望这可以帮助那些遇到同样问题的人。

Javascript适用于Webkit但不适用于FF

1 个答案: