在 IE11 中未触发单击事件答案

【问题标题】：click event not firing in IE11在 IE11 中未触发单击事件
【发布时间】：2014-07-25 10:30:19
【问题描述】：

我有这个 js 文件：

function fireClick(node){
    if ( document.createEvent ) {
        var evt = document.createEvent('MouseEvents');
        evt.initEvent('click', true, false);
        node.dispatchEvent(evt);
    } else if( document.createEventObject ) {
        node.fireEvent('onclick') ;
    } else if (typeof node.onclick == 'function' ) {
        node.onclick();
    }
}

function selectAvatar()
{

    var fileSelector = document.createElement('input');
    fileSelector.setAttribute('type', 'file');
    fileSelector.setAttribute('accept', "image/gif, image/jpeg");



    fileSelector.onchange = function(event) {
        var fileList = fileSelector.files;
        //alert(fileList.length);
        if (fileList.length==0) return;
        reader.readAsDataURL(fileList[0]);
    }
    var reader = new FileReader();

    reader.onload = function(e) {
        var dataURL = reader.result;
        //alert(dataURL);
        var container = document.getElementById("avatart-container-div");
        var backgroundIMgString = 'url("'+dataURL+'")';
        container.style.backgroundImage=backgroundIMgString;
    }
    fireClick(fileSelector);
}

它应该以编程方式打开一个文件选择器来选择一个 imgae。虽然这适用于 FF 和 chrome，但这不适用于 IE（11 是我的版本）。选择器本身不会出现。逐行尝试调试，但一切似乎都很好（没有错误或异常）。有人知道可能是什么问题吗？

【问题讨论】：

文件选择器是指input[type="file"]吗？ IE 在隐藏文件输入方面可能有一些奇怪的安全限制，但有一些变通方法。文件选择器是否隐藏？如果隐藏，取消隐藏会发生什么？
是的，我的意思是input[type="file"]。如您所见，它根本没有添加到 DOM 中。会尝试看看会发生什么。
啊，这是因为您只是在创建元素，而不是将其添加到 DOM 中，例如将其添加到您可以使用的正文中：document.body.appendChild(fileSelector);
是的，刚刚测试它并且它工作。有趣的是，这在 FF 和 chrome 上是如何工作的，但 IE 实际上试图为你提供保护。将其发布为答案

标签： javascript onclick filepicker

【解决方案1】：

取自cmets：

您实际上只是在创建元素，没有将其添加到 DOM。您可以将其添加到 DOM 中：document.body.appendChild(fileSelector);

并且在selectAvatar函数中：

function selectAvatar()
{

    var fileSelector = document.createElement('input');
    fileSelector.setAttribute('type', 'file');
    fileSelector.setAttribute('accept', "image/gif, image/jpeg");

    document.body.appendChild(fileSelector);

    // do stuff
}

也叫 здрасти

【讨论】：