продолжаю работу с drag and drop , и решил добавить html 5 drag and drop
и столкнулся с проблемой, к примеру есть такой код
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=utf-8 />
<title>Пример Drag and Drop в HTML 5</title>
<style>
#dropTarget {
width: 530px;
height: 200px;
border: 3px dotted black;
}
</style>
</head>
<body>
<img src="http://html5blog.ru/news/images/HTML5_3D_Effects_64.png" alt="HTML5 3D Effects" />
<img src="http://html5blog.ru/news/images/HTML5_Connectivity_64.png" alt="HTML5 Connectivity" />
<img src="http://html5blog.ru/news/images/HTML5_Device_Access_64.png" alt="HTML5 Device Access" />
<img src="http://html5blog.ru/news/images/HTML5_Multimedia_64.png" alt="HTML5 Multimedia" />
<img src="http://html5blog.ru/news/images/HTML5_Offline_Storage_64.png" alt="HTML5 Offline Storage" />
<img src="http://html5blog.ru/news/images/HTML5_Performance_64.png" alt="HTML5 Performance" />
<img src="http://html5blog.ru/news/images/HTML5_Semantics_64.png" alt="HTML5 Semantics" />
<img src="http://html5blog.ru/news/images/HTML5_Styling_64.png" alt="HTML5 Styling" />
<div id="dropTarget" ondragenter="cancel(event)" ondragover="cancel(event)" ></div>
<script type="text/javascript">
document.body.ondragstart = function(event){
event.target.id = "now_drag_obj";
event.dataTransfer.setData("obj","now_drag_obj")
}
document.body.ondragend = function(event){
event.target.id = "";
}
document.getElementById("dropTarget").ondrop = function(event){
var obj = event.dataTransfer.getData("obj");
var elem = document.getElementById("now_drag_obj");
this.appendChild(elem);
this.style.border = "2px dashed black";
return false;
}
function cancel(event){
if (event.preventDefault){
event.preventDefault();
}
return false;
}
</script>
</body>
</html>
что бы перемещать обьект приходится присваивать ему id и поэтому id потом искать(первое что в голову пришло), поискав на зарубежных ресурсах , альтернатив не на шел , я так понял через
event.dataTransfer.setData нельзя передать event.target (или все таки как то можно?).
П.с я знаю что можно при событие заносить target в свойство какого то обьекта и через него работать как вариант...
и ще один вопрос :
зачем отменяют действия браузера по умолчанию , используют
preventDefault() (я понимаю зачем это делают вообще, но зачем для элементов переноса?)