<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#div1,#div2
{
float:left;width:100px;height:35px;
margin:10px;padding:10px;border:1px solid #aaaaaa;
}
</style>
<script type="text/javascript">
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));
}
</script>
<title></title>
</head>
<body>
<div id="div1" οndrοp="drop(event)" οndragοver="allowDrop(event)">
<img src="../pic/123.jpg" dragable="true" οndragstart="drag(event)" id="drag1">
</div>
<div id="div2" οndrοp="drop(event)" οndragοver="allowDrop(event)"></div>
</body>
</html>
<!-- 其实我们来看怎样实现在两个方格中实现图片的拖放,一开始我们要将图片放在一个框框里面为了实现这个要求我们在首先是<div ></div>在这个标签之间加上一个图片,
我们设置图片在第一个方格里面,现在我们要将图片拖动带第二个方格里面,我们对图片也要记性进行属性的设置,特别的是当我们将图片拖到目的地时候,我们在目的地也要进行属性的设置,目的地怎样来实现的,在这个程序中是我们一开始定义的方格是时候用到的style这个标签,在这个标签里面我们定义的要#div1,#div我们在body里面将这样的两个定义作为是<div>这个标签的属性id的值,在div这个标签里面我们除了对id这个属性应用之外,还有就是
ondrop和ondragover这个两个属性值进行赋值,在赋值的时候用到的javaScript中的函数,其实也可以说赋值的时候是调用函数进行赋值的,并且函数的参数都是event这个值,img中定义 是属性也是三个,对于src这个属性除外,一个是id,一个是dragable和ondragstart这三个属性,这个程序在body中实现拖放我们需要做的 也就是那么多,那么在head之间我们还要对定义的函数进行调用script中的函数-->
<html>
<head>
<style type="text/css">
#div1,#div2
{
float:left;width:100px;height:35px;
margin:10px;padding:10px;border:1px solid #aaaaaa;
}
</style>
<script type="text/javascript">
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));
}
</script>
<title></title>
</head>
<body>
<div id="div1" οndrοp="drop(event)" οndragοver="allowDrop(event)">
<img src="../pic/123.jpg" dragable="true" οndragstart="drag(event)" id="drag1">
</div>
<div id="div2" οndrοp="drop(event)" οndragοver="allowDrop(event)"></div>
</body>
</html>
<!-- 其实我们来看怎样实现在两个方格中实现图片的拖放,一开始我们要将图片放在一个框框里面为了实现这个要求我们在首先是<div ></div>在这个标签之间加上一个图片,
我们设置图片在第一个方格里面,现在我们要将图片拖动带第二个方格里面,我们对图片也要记性进行属性的设置,特别的是当我们将图片拖到目的地时候,我们在目的地也要进行属性的设置,目的地怎样来实现的,在这个程序中是我们一开始定义的方格是时候用到的style这个标签,在这个标签里面我们定义的要#div1,#div我们在body里面将这样的两个定义作为是<div>这个标签的属性id的值,在div这个标签里面我们除了对id这个属性应用之外,还有就是
ondrop和ondragover这个两个属性值进行赋值,在赋值的时候用到的javaScript中的函数,其实也可以说赋值的时候是调用函数进行赋值的,并且函数的参数都是event这个值,img中定义 是属性也是三个,对于src这个属性除外,一个是id,一个是dragable和ondragstart这三个属性,这个程序在body中实现拖放我们需要做的 也就是那么多,那么在head之间我们还要对定义的函数进行调用script中的函数-->