Question

朋友您好，这是我的代码

function dropItems(idOfDraggedItem,targetId,x,y)
{
    var html = document.getElementById('dropContent').innerHTML;
    if(html.length<=0){
        html.innerHTML='<img src="images/drag.jpg" alt=" " />'
    }
    if(html.length>0)html = html + '<br>';
    html = html + document.getElementById(idOfDraggedItem).innerHTML;
    document.getElementById('dropContent').innerHTML = html;
}

我想在div中显示一个图像，当它是空的时...但是当它接收到任何数据时我想通过使用这个脚本删除该图像。但它不工作的PLZ帮助我

Answer 1

function dropItems(idOfDraggedItem,targetId,x,y)
{
    html = document.getElementById('dropContent');
    if(html.innerHTML.length<=0){
        html.innerHTML='<img src="images/drag.jpg" alt=" " />'
    }
    if(html.innerHTML.length>0)html = html + '<br>';
    html = html + document.getElementById(idOfDraggedItem).innerHTML;
    document.getElementById('dropContent').innerHTML = html;
}

Answer 2

function dropItems(idOfDraggedItem,targetId,x,y)
{
    var html = document.getElementById('dropContent');
    if(html.innerHTML.length<=0){
        html.innerHTML='<img src="images/drag.jpg" alt=" " />'
    }
    if(html.innerHTML.length>0)html+='<br>';
    html += document.getElementById(idOfDraggedItem).innerHTML;
    document.getElementById('dropContent').innerHTML = html;
}

Answer 3

var html = document.getElementById('dropContent').innerHTML;

这里你将值传递给'html'。不是'dropContent'的引用。所以你不能在变量上调用'innerHTML'。

//修改代码

function dropItems(idOfDraggedItem,targetId,x,y)
{
    var html = document.getElementById('dropContent').innerHTML;
    if(html.length<=0){
        html = '<img src="images/drag.jpg" alt=" " />'
    }
    if(html.length>0)html = html + '<br>';
    html = html + document.getElementById(idOfDraggedItem).innerHTML;
    document.getElementById('dropContent').innerHTML = html;
}

Answer 4

问题是dropContent可能不是空的，即使它什么也没有显示;因为，Javascript不会忽略白色间距，因此可能存在一个保持长度大于零的空白区域。这是解决方案，使用jQuery库，因为它具有修剪内容和其他内容所需的方法：

    function dropItems(idOfDraggedItem, targetId, x, y) {
        var html = $("#dropContent").html();
        html = $.trim(html);
        if (html.length <= 0) {
            var imageContent = $('<img src="images/drag.jpg" alt="" /><br />' + $("#" + idOfDraggedItem).html());
            $("#dropContent").html(imageContent);

        }
    }

在我创建的测试页面中，它对我有用。

第一行从元素中获取html，第二行修剪它，并且thirth行检查它是否为空。 Forth行使用html字符串和idOfDraggedItem元素的html内容创建一个元素。第五行将dropContent的html内容设置为最近创建的元素的html内容。就是这样。

希望这也适合你。

PS jQuery的.html（）方法提取元素的innerHtml，如果你想要outerHtml，将元素包装在div中并从div获取.html（）以获取包装元素的outHtml。 / p>

使用innerHtml方法应用图像但不起作用

4 个答案: