上传前无法显示图像

时间:2014-11-15 16:48:44

标签: javascript html image

我有一个菜单,可以在同一页面中加载外部文件(表单),菜单使用某些功能进行菜单样式

菜单功能

function getXmlHttp() {
                try {
                    return new ActiveXObject("Msxml2.XMLHTTP");
                } catch (e) {
                    try {
                        return new ActiveXObject("Microsoft.XMLHTTP");
                    } catch (ee) {
                    }
                }
                if (typeof XMLHttpRequest !== 'undefined') {
                    return new XMLHttpRequest();
                }
            }
            function hide(node) {
                node.style.display = 'none';
            }
            function func(e) {
                e.preventDefault();
                var q = getXmlHttp();
                var url = this.getAttribute('href');
                q.open('GET', url, false);
                q.send(null);
                var result = 'File ' + url + ' not found.';
                if (q.status === 200) {
                    result = q.responseText;
                }
                document.querySelector('.page').innerHTML = result;
                document.querySelector('#leftmenu').style.width = '70px';
                var items = document.querySelectorAll('li ul, #leftmenu b');
                for (var i = 0; i < items.length; i++) {
                    hide(items[i]);
                }
                this.removeEventListener('click', func(), false);
            }

            function slideUp(node) {
                node.setAttribute('class', "submenu hidden");
            }

            function slideDown(node) {
                node.setAttribute('class', "submenu visible");
            }

            function switchSubMenu() {
                var ch = this.children;
                for (var i = 0; i < ch.length; i++) {
                    if (ch[i].nodeName === 'UL') {
                        var v = document.getElementsByClassName("visible");
                        if (v) {
                            for (var j = 0; j < v.length; j++) {
                                if (v[j] !== ch[i]) {
                                    slideUp(v[j]);
                                }
                            }
                        }
                        ch[i].getAttribute('class') === "submenu hidden" ? slideDown(ch[i]) : slideUp(ch[i]);
                    }
                }
            }

            var sm = document.querySelectorAll('.submenu');
            for (var i = 0; i < sm.length; i++) {
                slideUp(sm[i]);
                sm[i].parentNode.addEventListener("click", switchSubMenu, false);
            }
            var links = document.querySelectorAll('.reveal');
            var url = '';
            for (var j = 0; j < links.length; j++) {
                links[j].addEventListener("click", func, false);
            }

在外部页面(表格)中使用波纹管功能在同一页面显示图像

图像预览功能

function handleFileSelect(evt) {
        var files = evt.target.files;
        for (var i = 0, f; f = files[i]; i++) {
            if (!f.type.match('image.*')) {
                continue;}
            var reader = new FileReader();
            reader.onload = (function(theFile) {
                return function(e) {
                    var span = document.createElement('span');
                    span.innerHTML = ['<img class="thumb" src="', e.target.result,
                        '" title="', escape(theFile.name), '"/>'].join('');
                    document.getElementById('list').insertBefore(span, null);};
            })(f);
            reader.readAsDataURL(f);}}
    document.getElementById('files').addEventListener('change', handleFileSelect, false);

错误

当我单独运行表单文件并添加图像时,当我使用onload方法打开同一页面中的外部文件并添加图像时,图像显示图像预览

可以帮我一些错误的事情

1 个答案:

答案 0 :(得分:0)

您使用removeEventListener的方式不正确。第二个参数是处理函数指标。应该是这样的(没有括号):

this.removeEventListener('click', func, false);

我猜你应该在浏览器devtool中看到错误。