2

可能重复：
在 JavaScript 中，我可以通过编程方式为文件输入元素触发“点击”事件吗？

我想进行单击上传，所以我像这样隐藏 <form>内部<iframe>（我只是<iframe>在周围输入标签<form>来隐藏表单）：

<iframe id="iframe" name="iframe" height="1" width="1" frameborder="0">
    <form id="form1" enctype="multipart/form-data" method="post" action="uploaded.php">
        <div class="row">
        <label for="file">Select a File to Upload (up to 20MB)</label><br />
        <input type="file" name="file" id="file" size="40" onchange="uploadFile()" />
        </div>
    </form>
</iframe>

然后在外面<iframe>我做了一个按钮：

<div align="center">
    <input type="button" value="Upload" align="center" onclick="browse();" />
</div>

浏览（） javascript是这样的：

function browse()
{
    var iframe = document.getElementById.("iframe");
    var input = iframe.contentDocument || iframe.contentWindow.document;
    input.getElementById('file').click();
}

但它不起作用。浏览文件对话框未打开。我正在使用 Firefox 17。有没有办法在<input>内部单击（）<iframe>或任何其他一键上传解决方案，但仍在使用我的 uploadFile() AJAX 功能？

function uploadFile() {
        var fd = new FormData();
        fd.append("file", document.getElementById('file').files[0]);
        var xhr = new XMLHttpRequest();
        xhr.upload.addEventListener("progress", uploadProgress, false);
        xhr.addEventListener("load", uploadComplete, false);
        xhr.addEventListener("error", uploadFailed, false);
        xhr.addEventListener("abort", uploadCanceled, false);
        xhr.open("POST", "uploaded.php");
        xhr.send(fd);
      }

编辑：当表单不在 iframe 中时，这是有效的，所以我的问题不是我是否可以使用 click() on <input type="file">。我可以并且它在 Firefox 17 中工作。我的问题是如何在<input type="file">inside上使用 click() <iframe>。

4

2 回答 2

-1

<iframe>如果浏览器不支持 iframe，则可以使用的替代内容。它们不构成加载到框架中的文档的一部分（这是contentDocument可以访问的）。

您的问题（或至少您的第一个问题）是您正试图将其用作隐藏内容的黑客。不要那样做。

于 2012-12-18T16:11:24.100 回答
-1

JavaScript 应该抛出一个错误，因为你有一个额外的类型.

var iframe = document.getElementById.("iframe");  
                                    ^-- typo
于 2012-12-17T23:38:15.763 回答