91超碰碰碰碰久久久久久综合_超碰av人澡人澡人澡人澡人掠_国产黄大片在线观看画质优化_txt小说免费全本

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

學習html5拖動drag

發布時間:2020-07-18 20:20:45 來源:網絡 閱讀:258 作者:haotianaoxiang 欄目:移動開發
 主要就是幾個事件函數及屬性
被拖動元素:draggable 屬性設置為true
           ondragstart(event)當元素被拖動時發生什么事
例如可以把被拖動元素的id存儲事件中 ev.dataTransfer.setData("name","value");value--ev.target.id
 
元素被放置
ondragover(ev) function 這個函數用來阻止瀏覽器的默認行為ev.preventDefault()
ondrop()元素被放置var id = ev.dataTransfer.getData("name");
ev.target.appendChild(document.getElementById(id))  ev.target是目標事件對象
要是去實現來回的拖動只要在目標對象上都加入ondragover ondrop 句柄就好了

 

<!DOCTYPE HTML>

<html>

<head>

<title></title>

<meta charset="utf-8"/>

<style>

#div1{width:200px; height:200px;border:solid 1px gray;}

#div2{width:200px; height:200px;border:solid 1px gray;}

img{border:solid 1px red;}

</style>

</head>

<div id="div1" ondragover="allowDrag(event)" ondrop="dropImg(event)"></div>

<div id="div2" ondragover="allowDrag(event)" ondrop="dropImg(event)">

<img id="img1" src="22.gif" draggable="true" ondragstart="dragImg(event)"/>

</div>

<script>

function dragImg(ev){

ev.dataTransfer.setData("heh",ev.target.id);

}

function allowDrag(ev){

ev.preventDefault();

}

function dropImg(ev){

ev.preventDefault();

var data = ev.dataTransfer.getData("heh");

//console.log(document.getElementById(data));

ev.target.appendChild(document.getElementById(data));

}

</script>

<body>

</body>

 

 

 

 

 

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

宜都市| 阿拉尔市| 牡丹江市| 衡水市| 龙游县| 兰西县| 长阳| 顺昌县| 宁强县| 建宁县| 石屏县| 乌恰县| 广饶县| 陆川县| 武山县| 虎林市| 中方县| 桃江县| 鲁甸县| 左权县| 金平| 南涧| 宜兰县| 安宁市| 清丰县| 漳州市| 突泉县| 合阳县| 巴塘县| 汝城县| 建始县| 高阳县| 布拖县| 克山县| 左贡县| 法库县| 崇信县| 西乌珠穆沁旗| 西丰县| 措美县| 和龙市|