放一張圖片是div是空的

-1

我有一些代碼，我是新來的編碼，我正在做一個項目。我有幾個div，我想要一些只拖入空間的對象，div是空的。如果你能幫助我的話，這將會非常有幫助。放一張圖片是div是空的

<!DOCTYPE HTML> 
<html> 
<head> 
<style> 
#div1, #div2, #div3, #div4 { 
    margin: 10px; 
    padding: 10px; 
    border: 1px solid black; 
    min-height: 100px; 
    min-width: 100px; 
} 
</style> 
    <script> 
    function allowDrop(ev) { 
     ev.preventDefault() 
    } 

    function drag(ev) { 
    ev.dataTransfer.setData("text", ev.target.id) 
} 

function drop(ev) { 
    ev.preventDefault() 

    var data = ev.dataTransfer.getData("text") 
    ev.target.appendChild(document.getElementById(data)) 
} 

function test_div_child() { 
    //var x = document.getElementsByTagName("h2"); 
    //alert(x[0].innerHTML); 
    var x = document.getElementById('div1').innerHTML 
    //alert(x.length) 

    if(x.length<=5){ 
     alert("then drop image"); 
    } 
} 

</script> 
</head> 
<body> 

<h2>Drag and Drop</h2> 
<p>Drag the image back and forth between the two div elements.</p> 
<table> 
    <tr> 
     <td> 
      <p>first</p> 
     </td> 
     <td> 
      <div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"></div> 
     </td> 
     <td> 
      <p>then</p> 
     <td> 
      <div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div> 
     </td> 
     <td> 
      <div id="div3" ondrop="drop(event)" ondragover="allowDrop(event)"></div> 
     </td> 
     <td> 
      <div id="div4" ondrop="drop(event)" ondragover="allowDrop(event)"></div> 
     </td> 
    <tr> 
<table> 
<div> 
<p>Image Gallery</p> 
<img src="testphoto.gif" draggable="true" ondragstart="drag(event)" id="drag2"> 
<img src="testphoto.gif" draggable="true" ondragstart="drag(event)" id="drag3"> 
<img src="testphoto.gif" draggable="true" ondragstart="drag(event)" id="drag4"> 
<img src="testphoto.gif" draggable="true" ondragstart="drag(event)" id="drag5"> 
<img src="testphoto.gif" draggable="true" ondragstart="drag(event)" id="drag6"> 
</div> 
<div><button type="button" onclick="test_div_child()">Test Div Child</button></div> 
</body> 
</html>

來源

2016-11-14 William Yang

else if (div == 'element') 
{ 

}

添加到控制是你可以將一個元素或沒有功能這一點。它看起來是否看到一個div包含一個元素。

在一個示例代碼，你可以這樣說：

function drop(ev, div) { 
ev.preventDefault() 
if(div == 'div4') 
{ 
    var data = ev.dataTransfer.getData("text") 
    var element = document.getElementById(data) 
    element.parentNode.removeChild(element) 
} 
else if (div == 'element') 
{ 

} 
else 
{ 
    if(document.getElementById(div).innerHTML <= 5) 
    { 
     var data = ev.dataTransfer.getData("text") 
     ev.target.appendChild(document.getElementById(data)) 
    } 
}} 

<p id="element"><img src="http://media.istockphoto.com/illustrations/cute-bright-red-apple-icon-isolated-on-white-illustration-id90692172?k=6&m=90692172&s=170667a&w=0&h=QxpaX5OjVcoN5VPxptnOM_sWuCOB2VNDAdQEJ_Qx5zU=" draggable="true" ondragstart="drag(event)" id="drag1" width="100" height="100"></p>

來源

2016-11-14 14:02:17

你應該格式化您的div像：

<div id="tags"><font size="7">&nbspAfter&nbsp&nbsp</font></div>&nbsp<br><br><br><br> 
<div id="div3" ondrop="drop(event, 'div3')" ondragover="allowDrop(event, 'div3')"></div>

有：

function allowDrop(ev, div) { 
ev.preventDefault()

}

來源

2016-11-14 14:26:56

放一張圖片是div是空的

回答

相關問題