Javascript 无法将图像放到目标位置_Javascript_Html

Javascript 无法将图像放到目标位置

javascript html

Javascript 无法将图像放到目标位置,javascript,html,Javascript,Html,我已经编写了一个简单的拖放代码。让我们看看代码 <!DOCTYPE html> <html> <head> <title>System Drag and Drop Example</title> <script type="text/javascript"> { function dragUser(user,oEvent) {

我已经编写了一个简单的拖放代码。让我们看看代码

<!DOCTYPE html>
<html>
<head>
    <title>System Drag and Drop Example</title>
    <script type="text/javascript">
        {
            function dragUser(user,oEvent)
            {
                oEvent.dataTransfer.setData('User',user.id)
            }
            function dropUser(target,oEvent)
            {
                var user= oEvent.dataTransfer.getData('User');
                alert(user);
                alert(target);
                target.appendChild(document.getElementById('user'));
                oEvent.returnValue=false;
            }
        }
    </script>
</head>
<body>
<p>Try daragging this text to the red box</p>
<p>
    <div style="border: 1px solid black; width: 150px; height: 150px">
        <img id="img" src="mine,image,life,quote,words,message-5eb746364548d71d07c86e52e63b7b56_h.jpg" width="100px" height="100px" ondragstart="dragUser(this,event)">
    </div>

    <div id="div2" style="background-color: red; width: 100px; height: 100px; clear: both" ondrop="dropUser(this,event)" ondragenter="return false" ondragover="return false">

    </div>
</p>

</body>

</html>


系统拖放示例
{
函数dragUser（用户、oEvent）
{
oEvent.dataTransfer.setData（'User'，User.id）
}
函数dropUser（目标，oEvent）
{
var user=oEvent.dataTransfer.getData（'user'）；
警报（用户）；
警报（目标）；
target.appendChild（document.getElementById（'user'））；
oEvent.returnValue=false；
}
}
尝试将此文本标记为红色框

问题是，当我尝试使用id=“div2”将图像从上面的div拖动到下面的div时，我的图像没有被删除，而是作为图像在选项卡中打开。

请告诉我这背后的原因。

你能提供一个真实的例子吗？为什么你的JS用{}包装？没有名为user的id。您正在引用不存在的内容。不，我正在使用具有正确id的firefoxworks：