Nová ukázka
Reset
Načíst z URL
Uložit a získat odkaz
Vztahuje se k…
Nevyplňujte
Napiště „nejsem robot“
▶
Přepnout zobrazení
Výsledek
<table border=1> <tr> <td id="td1" ondrop="return drop(event, this)" ondragover="return allowDrop(event, this)"> td1 <p id="p1" draggable="true" ondragstart="drag(event)">p1</p> </td> <td id="td2" ondrop="return drop(event, this)" ondragover="return allowDrop(event, this)"> td2 <p id="p2" draggable="true" ondragstart="drag(event)">p2</p> </td> </tr> </table>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
p {background:yellow;}
CSS
Autoformát
CSS reset
Až na konci
function allowDrop(ev, target) { ev.preventDefault(); return target.id!=ev.dataTransfer.getData("from"); } function drag(ev) { ev.dataTransfer.setData("text", ev.target.id); ev.dataTransfer.setData("from", $(ev.target).closest('td').get(0).id); } function drop(ev, target) { ev.preventDefault(); if(target.id==ev.dataTransfer.getData("from")) return false; var data = ev.dataTransfer.getData("text"); target.appendChild(document.getElementById(data)); $.ajax({ traditional: true, method: "GET", 'url': 'dummy', 'data': {target: target.id, data: data } }); }
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>