javascript - Javascript DOM鼠标事件不适用于IE和Mozilla

使用“自定义文件”上载应用程序。我有2个主要问题：


以下给出的以下代码未打开Mozilla和IE的文件对话框。
在Chrome中，它可以正常工作，但是当我选择“首次单击文件”时，它永远不会将文件添加到正文中。但是在第二次单击中，它会将在“第一次单击中浏览”的文件添加到正文中。


对于以上问题的任何帮助将不胜感激。

函数perform1Click（node）{

            alert（“ INIT”）;
            var evt = document.createEvent（“ MouseEvents”）;
            evt.initEvent（“ click”，true，false）;
            node.dispatchEvent（evt）;

            警报（3）
            getFile（evt）;

        }

        函数getFile（event）{

            var files = event.target.files;
            var totalSize = 0;

            如果（totalSize> 1024 * 10）{

                alert（'总大小超过1 Mb。'）;
                返回;
            }
            //警告（文件）
            //alert(files.length）;
            for（var i = 0，f; f = files [i]; i ++）{

                displayFileList（f.name，f.size）;
                totalSize = totalSize + f.size;
            }
        }

        函数displayFileList（name，size）{

            如果（name！=''）{

                var top_plugin = document.getElementById（'top_plugin'）;

                //创建标签
                var ptag = document.createElement（“ p”）;

                //创建div
                var divBox = document.createElement（“ div”）;
                divBox.setAttribute（'class'，'divBox'）;

                //创建输入[type ='checkbox']
                var inputCheckBox = document.createElement（“ input”）;
                inputCheckBox.setAttribute（'type'，'checkbox'）;
                inputCheckBox.setAttribute（'id'，'checkboxClass'）

                //在div中添加复选框。
                divBox.appendChild（inputCheckBox）;

                //为divBox创建文本节点并将其添加到divBox中。
                var txtNode = document.createTextNode（name）;
                divBox.appendChild（txtNode）

                var sizeDivBox = document.createElement（“ p”）;
                sizeDivBox.setAttribute（'style'，'clear：both; display：inline-block;'）;

                var txtSizeNode = document.createTextNode（size）;
                sizeDivBox.appendChild（txtSizeNode）;
                divBox.appendChild（sizeDivBox）;

                //将divBox添加到ptag。
                ptag.appendChild（divBox）;
                //ptag.appendChild(divTxt）;

                //将ptag添加到top_plugin div。
                top_plugin.appendChild（ptag）;
            }

            //如果文件值不为null，请将其留空。
            如果（name！=''）
            {
                名称='';
            }
        }

最佳答案

我得到了相同问题的解决方案。请在下面的新代码中查找。

   function uploadDFiles() {

        var file = document.getElementById('_file');
        file.click();

        try {
            file.addEventListener("change", getFileName);
        }
        catch (e) {
            file.attachEvent("onclick", getFileNameOnIE);
            alert("Error:: "+e.description);
        }
    }

    function getFileName(event) {

        var files = event.target.files;
        for (var i = 0, f; f = files[i]; i++) {

            var fileName = f.name;
            var fileSize = f.size;

            var fSize = bytesToSize(fileSize, 2);

            displayFileList(fileName, fSize);
        }
    }

但是现在我有了新问题。这段代码在IE中不起作用。对于IE，我正在使用attachEvent方法并且不起作用。请在下面的代码中找到：

    function getFileNameOnIE(event) {

        alert(event.type);
        var files = event.target;
        alert(files.length);

        for (var i = 0, f; f = files[i]; i++) {

            displayFileList(f.name, f.size);
        }
    }

有人可以为我提供同样的解决方案吗？

-

ks
巴拉特