drag and drop - assign ondrop to an element in JavaScript

Question

Welcome To Ask or Share your Answers For Others

drag and drop - assign ondrop to an element in JavaScript

posted Oct 7, 2021 in Technique[技术] by 深蓝 (71.8m points)

drag and drop - assign ondrop to an element in JavaScript

I'm still struggeling with an piece of JavaScript coding. I've stripped it down to the following coding:

<!DOCTYPE html>
<html lang="de">
<meta charset="UTF-8">
<title>dad-test</title>
<body>
<div  id='spaltemu'> </div>
<script type="text/javascript">
function allowdrop(event) {
  event.preventDefault();
}
function drag(event) {
  event.dataTransfer.setData("text", event.target.id);
}
function drop(event) {
  event.preventDefault();
  var data = event.dataTransfer.getData("text");
  event.target.appendChild(document.getElementById(data));
}
    var spkart = document.getElementById ('spaltemu');
    spkart.ondrop = 'drop(event)';
    spkart.ondragover = 'allowdrop(event)';
    alert ('Halt');
</script>
</body>
</html>

When running this code the debugger shows that neither the assignment of ondrop nor the one of ondragover works. Debugger shows "null" as value. I don't understand what's wrong. Any hint is very much appreciated!

question from:https://stackoverflow.com/questions/65832431/assign-ondrop-to-an-element-in-javascript

与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…

1 Reply

深蓝 · Answer 1 · 2021-10-06T19:36:45+0000

Finally I found a solution to this though I don't understand the problem completely. Why does this lead to an error: ...

function allowdrop(event) {
  event.preventDefault();
}
var spkart = document.getElementById ('spaltemu');
spkart.ondragover = 'allowdrop(event)';

while thisone works:

spkart.ondragover = function(event) {
event.preventDefault();
};

Nevertheless I found a solution ...

Categories

drag and drop - assign ondrop to an element in JavaScript

drag and drop - assign ondrop to an element in JavaScript

Please log in or register to add a comment.

Please log in or register to reply this article.

1 Reply

Please log in or register to add a comment.

Just Browsing Browsing

Most popular tags