在draganddrop中添加多个图像

<!DOCTYPE HTML> 
<html> 
<head> 
<style type="text/css"> 
#divdrag1,#divdrag2 
{float:left; width:100px; height:200px; margin:10px;padding:10px;border:1px solid #aaaaaa;} 

#div2,#div3 
{float:left; width:200px; height:100px; margin:10px;padding:10px;border:1px solid #aaaaaa;} 


</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)); 
document.getElementById(data).width="200" 
document.getElementById(data).height="100" 
} 
</script> 
</head> 
<body> 
<form id="f1" name="form1" method="post"> 



    <div name="answer"> 
     <div id="divdrag1" ondrop="drop(event)" ondragover="allowDrop(event)" > 
      <img src="smiley.png" draggable="true" ondragstart="drag(event)" id="drag1" width="88" height="31"> 
     </div> 
     <div id="divdrag2" ondrop="drop(event)" ondragover="allowDrop(event)" > 
      <img src="pic1.jpg" draggable="true" ondragstart="drag(event)" id="drag1" width="88" height="31"> 
     </div> 

    </div> 

    <div> 
     <div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div> 
     <div id="div3" ondrop="drop(event)" ondragover="allowDrop(event)"></div> 
    </div> 




</form> 
</body> 
</html>

嘿，我需要添加多个图像单div（div name =“answer”）在draganddrop控制我试过，但它没来。每个图像显示在单独的div中。当我拖动它也没有正确显示时，请告诉我我做错了什么。哪一个我必须纠正。请指引我的朋友在draganddrop中添加多个图像

来源

2013-10-03 Bhargavi

。利用“多”的。会做。 –

<div id="divdrag1" ondragover="allowDrop(event)" > 
      <ul type="none"> 
       <li><img src="smiley.png" draggable="true" ondragstart="drag(event)" id="drag1" width="88" height="31" align="left"> </li> 
       <li><img src="pic1.jpg" draggable="true" ondragstart="drag(event)" id="drag2" width="88" height="31"> </li> 
      </ul> 

     </div>

使用这些点点，我们可以在div标签在你的div添加多张图片

来源

2013-10-04 05:04:17 Bhargavi

在draganddrop中添加多个图像

回答

相关问题