0

我有这个代码功能，我试图获取一个 html 并在 msg 中收到的 html 中附加一个 li 但不工作

function handleFileSelect(evt)
{
    var files = evt.target.files;
    $('#visor_zone').fadeOut(600);
    $('#visor_zone').empty();
    $.ajax(
    {
        url: '/home/visor_publicacion',
    }).done(function(msg)
        {
            var html=msg;
            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 li = document.createElement('li');
                        li.innerHTML = ['<li><a><img ref="', e.target.result,'" src="', e.target.result,'"/></a><span>esta es la foto agregada</span></li>'].join('');
                        //li.innerHTML = ['Nombre: ', escape(theFile.name), ' || Tamanio: ', escape(theFile.size), ' bytes || type: ', escape(theFile.type), '<br /><img class="thumb" src="', e.target.result,'" title="', escape(theFile.name), '"/><br />'].join('');
                        html.getElementById('pikame').appendChild(li);
                    };
                })(f);
                reader.readAsDataURL(f);
            }
            $('#visor_zone').fadeIn(600,function()
                {
                    $('#visor_zone').html(html);
                    $("#pikame").PikaChoose({autoPlay:false});
                });

        });
}
document.getElementById('files').addEventListener('change', handleFileSelect, false);

它不起作用，但接下来的工作为什么是那些之间的区别

function handleFileSelect(evt)
{
    var files = evt.target.files;
    $('#visor_zone').fadeOut(600);
    $('#visor_zone').empty();
    $.ajax(
    {
        url: '/home/visor_publicacion',
    }).done(function(msg)
        {
            $('#visor_zone').html(msg);
            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 li = document.createElement('li');
                        li.innerHTML = ['<li><a><img ref="', e.target.result,'" src="', e.target.result,'"/></a><span>esta es la foto agregada</span></li>'].join('');
                        //li.innerHTML = ['Nombre: ', escape(theFile.name), ' || Tamanio: ', escape(theFile.size), ' bytes || type: ', escape(theFile.type), '<br /><img class="thumb" src="', e.target.result,'" title="', escape(theFile.name), '"/><br />'].join('');
                        document.getElementById('pikame').appendChild(li);
                    };
                })(f);
                reader.readAsDataURL(f);
            }
            $('#visor_zone').fadeIn(600,function()
                {
                    $("#pikame").PikaChoose({autoPlay:false});
                });

        });
}
document.getElementById('files').addEventListener('change', handleFileSelect, false);
4

1 回答 1

2

var html=msg;

一个原因failure of first是在需要在 DOM 上执行的字符串上的方法上调用 javascript

var html=msg;字符串中有 html 而不是 dom，因此您无法在其上执行适用于 DOM 的 javascript 方法

$('#visor_zone').html(msg);

原因success of second之一是上面的语句，recevived msg string 作为 visor_zone 元素的 html 分配给 dom，这使得 javascript 方法可以处理接收到的消息 html（成为 DOM 的一部分）

于 2012-09-08T09:10:37.960 回答