addEventListener 在 IE11 中不起作用

Question

下面的javascript 函数上传所选文件并更新网格。它在 firefox 中运行良好，但在 IE11 中运行不佳。观察到它没有在 addEventListener 中执行 "ESignature/Registration" 函数。我在注册功能处保留了断点。它没有受到打击，也没有刷新网格。请指导我解决这个问题

     $("#lnkAddAttachment").click(function (e) {
        if (document.getElementById("txtFile").files[0] != null) {
            oFiles = document.getElementById("txtFile").files[0];
            nFiles = oFiles.size;

            var selectedFile = document.getElementById("txtFile").files[0];

            var xhr = new XMLHttpRequest();
            var fd = new FormData();
            var url = '@Url.Content("~/")' + "ESignature/getFile";

            fd.append("file", document.getElementById('txtFile').files[0]);
            $("#loadingwrapper").fadeIn();
            xhr.open("POST", url, true);
            xhr.send(fd);
            xhr.addEventListener("load", function (event) {
                var url = '@Url.Content("~/")' + "ESignature/Registration";
                $('#gridAttachments').load(url + ' #gridAttachments');
                $("#loadingwrapper").fadeOut();
            }, false);
            $('#txtDescription').val('');
            $('#txtFile').val('');

            return false;
        } 
    });

Answer 1

由于您显然已经在使用 jQuery，因此我建议使用 $.ajax 而不是直接使用 XMLHttpRequest，这几乎肯定会解决问题。

但是如果你出于某种原因想继续直接使用XMLHttpRequest，你很可能需要使用readystatechange而不是load；也许 IE11 不支持 load，或者在它决定用于您的页面的任何兼容性设置中都不支持它。如果您的页面是在某些较旧的兼容模式下加载的，它在 XMLHttpRequest 对象上也不会有 addEventListener。

由于您不与任何人共享 XMLHttpRequest 实例，因此处理这两个潜在问题的简单方法是：

xhr.onreadystatechange = function () {
    if (xhr.readystate === 4) { // Also consider checking `status`
        var url = '@Url.Content("~/")' + "ESignature/Registration";
        $('#gridAttachments').load(url + ' #gridAttachments');
        $("#loadingwrapper").fadeOut();
    }
};

和一样，将 移动到 对 .send 的调用之上。

但是再说一次：您正在使用一个为您处理这些事情的库。使用它。

Answer 2

Firefox 支持"addEventListener" 方法，但IE 可能不支持。您需要使用 "onreadystatechange" 来处理完成请求的事件。此外，您需要在调用 "send" 之前设置 "onreadystatechange" 处理程序；否则，对服务器的请求可能会在您设置处理程序之前完成。

https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest?redirectlocale=en-US&redirectslug=DOM%2FXMLHttpRequest#Properties

Answer 3

我刚刚更改了 url，如下所示。有效。问题是每当低于 url 访问 IE 时，它从缓存中获取并且不会访问注册功能。为了使 url 每次都是唯一的，向 url 添加了名为 check 的新变量。它的值每次都是唯一的，点击注册功能。

var url = '@Url.Content("~/")' + "ESignature/Registration?check=" + new Date().getTime();

完整代码：

$("#lnkAddAttachment").click(function (e) {
    if (document.getElementById("txtFile").files[0] != null) {
        oFiles = document.getElementById("txtFile").files[0];
        nFiles = oFiles.size;

        var selectedFile = document.getElementById("txtFile").files[0];

        var xhr = new XMLHttpRequest();
        var fd = new FormData();
        var url = '@Url.Content("~/")' + "ESignature/getFile";

        fd.append("file", document.getElementById('txtFile').files[0]);
        $("#loadingwrapper").fadeIn();
        xhr.open("POST", url, true);
        xhr.send(fd);
        xhr.addEventListener("load", function (event) {
            var url = '@Url.Content("~/")' + "ESignature/Registration?check=" + new Date().getTime();
            $('#gridAttachments').load(url + ' #gridAttachments');
            $("#loadingwrapper").fadeOut();
        }, false);
        $('#txtDescription').val('');
        $('#txtFile').val('');

        return false;
    } 
});

谢谢T.J。克劳德和克里斯的意见。

addEventListener 在 IE11 中不起作用

addEventListener is not working in IE11

javascript

internet-explorer

asp.net-mvc-4