Javascript ajax不提交表单

我在做文件共享服务。然而，我遇到了一个问题。由于某些原因，正在选择文件，但是AJAX不会读取此选择，也不会自动上载文件。因此，此响应不会被处理回并插入到页面上的DIV中

HTML+表单

        <div class="file-input-wrapper"> 
          <form method="post" enctype="multipart/form-data" action="upload.xml">
          <button class="btn-file-input" id="bt">Select a File to Share</button>
          <input type="file" name="file" multiple />
          </form>
          <br/><br/>
          <div id="response"></div>
         </div>

选择要共享的文件

JAVASCRIPT

(function () {
    var input = document.getElementById("file"),
        formdata = false;

    function showUploadedItem(source) {
        document.getElementById("image-list").innerHTML = "<li><img src='" + source + "' /></li>";
    }

    if (window.FormData) {
       formdata = new FormData();
       document.getElementById("bt").style.display = "inline";
    }

    input.addEventListener("change", function (evt) {
        document.getElementById("response").innerHTML = "<div class='uploading'></div>"
        var i = 0,
            len = this.files.length,
            img, reader, file;
        formdata = new FormData();
        //for ( ; i < len; i++ ) {
        file = this.files[i];

        if (file.type.match(/file.*/)) {
            if (window.FileReader) {
                reader = new FileReader();
                reader.onloadend = function (e) {
                    var source = e.target.result;
                    document.getElementById("image-list").innerHTML = "<li><img src='" + source + "' /></li>";
                };
                reader.readAsDataURL(file);
            }
            if (formdata) {
                formdata.append("file[]", file);
            }
        }
        //}

        if (formdata) {
            $.ajax({
                    url: "upload.xml",
                    type: "POST",
                    data: formdata,
                    processData: false,
                    contentType: false,
                    success: function (res) {
                        document.getElementById("response").innerHTML = res;
                    }
                });
        }
    }, false);
})();

（函数（）{
var input=document.getElementById（“文件”），
formdata=false；
函数showUploadedItem（源代码）{
document.getElementById（“图像列表”）.innerHTML=“
”；
}
if（window.FormData）{
formdata=新的formdata（）；
document.getElementById（“bt”）.style.display=“inline”；
}
input.addEventListener（“更改”，函数（evt）{
document.getElementById（“响应”）.innerHTML=“”
var i=0，
len=this.files.length，
img、阅读器、文件；
formdata=新的formdata（）；
//对于（；i”；
};
reader.readAsDataURL（文件）；
}
if（formdata）{
formdata.append（“文件[]”，文件）；
}
}
//}
if（formdata）{
$.ajax({
url:“upload.xml”，
类型：“POST”，
数据：formdata，
processData:false，
contentType:false，
成功：功能（res）{
document.getElementById（“response”）.innerHTML=res；
}
});
}
}，假）；
})();

但是，当我尝试对文件输入文件进行样式化时，代码最初是有效的。这是一个非常糟糕的时刻，事情发生了变化，在这一点上，我不确定我做错了什么

你也可以在这个URL上查看代码：cyogen.com

这是因为你的id是“bt”而不是“btn”。在这一行：

document.getElementById("btn").style.display = "none";

---

那没什么区别，我把它改成了“bt”，它只是隐藏了按钮。单击按钮所在的空白部分仍将启动文件输入，但是选择文件不会导致上载。我将代码更新为document.getElementById（“bt”）.style.display=“inline”；还是和以前一样的问题，这导致脚本在Chrome中停止，但可能在其他地方有错误。哈，这很奇怪，我在Chrome最新版本“版本27.0.1453.110”中测试它，但速度没有任何问题。啊！请不要更正原始帖子中的代码。对于将来阅读这篇文章的人来说，这将是非常令人困惑的。你的问题是什么？上面的代码看起来很好，你查看的页面也很好。我不确定是不是你投了反对票，但如果你想仔细看看源代码，它与上面的不一样，那是因为我修复了它。这是在文件输入之后添加的