events-non-draggable-001-manual.html (1369B)
1 <!DOCTYPE html> 2 <meta charset='utf-8'> 3 <title>drag & drop – events should not fire with non-draggable elements – 001</title> 4 <style type="text/css"> 5 div { 6 height: 200px; 7 width: 200px; 8 background-color: orange; 9 position: absolute; 10 top: 8px; 11 left: 8px; 12 } 13 div + p { 14 margin-top: 220px; 15 } 16 </style> 17 18 <script> 19 window.onload = function() { 20 21 var elem = document.getElementsByTagName('div')[0]; 22 var pass = true; 23 24 function fail() { 25 pass = false; 26 } 27 28 elem.addEventListener('drag',fail,false); 29 elem.addEventListener('dragend',fail,false); 30 elem.addEventListener('dragenter',fail,false); 31 elem.addEventListener('dragleave',fail,false); 32 elem.addEventListener('dragover',fail,false); 33 elem.addEventListener('dragstart',fail,false); 34 elem.addEventListener('drop',fail,false); 35 36 elem.ondrag = fail; 37 elem.ondragend = fail; 38 elem.ondragenter = fail; 39 elem.ondragleave = fail; 40 elem.ondragover = fail; 41 elem.ondragstart = fail; 42 elem.ondrop = fail; 43 44 elem.onmouseup = function () { 45 setTimeout(function () { 46 if (pass == true) { 47 document.body.innerHTML = 'PASS'; 48 } else { 49 document.body.innerHTML = 'FAIL'; 50 } 51 }, 100 ); 52 }; 53 54 } 55 </script> 56 57 <div></div> 58 59 <p>Click once on the orange box above, without moving the mouse while 60 clicking. The word "PASS" should appear.</p>