Question

我已经搜索过SO，但没有找到其他帖子谈论我正在处理的同一个问题。我发现有几篇帖子谈论图像在将图像放在其他图像上时消失了，但我还没有找到一个关于图像在将它们放到空文本上时消失的帖子。

任何人都可以帮我理解为什么我的图像会消失吗？

（注意：我的小提琴并不像我在桌面上工作的方式那样工作;不确定我错过了什么;此刻，当用户将图像拖到textarea上时，网址会显示出来;另外，我的添加新单元格按钮不起作用;我将我使用的脚本添加到＆＃34;外部资源＆＃34;部分）

Here is my fiddle: https://jsfiddle.net/m52crpxa/5/

Answer 1

当然，当您将图像拖动到出租区时，它将消失，在文本区域中，您将获得拖动图像的网址（在某些浏览器中，图像将在新标签中打开）。

如果您希望图片显示在拖动的位置，请将您的taxtarea以透明背景放入div中。并设置文本区域：

＆＃13;

#div1{width: 150px; height:150px; position:relative; border:1px solid;}

textarea{
  position:absolut;
  width:100%;
  height:100%;
  opacity: 0;
  left:0;
  top:0;
}

#div1 img{width: 100%;height:100%;}

＆＃13;

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>

<div id="div1"><img /> <textarea></textarea></div>
<img src="https://www.gravatar.com/avatar/087039a00851e75ff483470e3aba89c9?s=48&d=identicon&r=PG" />
    
<script>
  $('textarea').on("drop", function ()
    {
        var $this = $(this);
        
        setTimeout(function ()
        {
            $($this).prev().attr('src', $this.val());
            $this.parent().css('border', '1px solid');
        }, 200);
    });
  $("textarea").bind("dragover", function ()
    {        
        $(this).parent().css('border', '2px dashed red');        
    });

    $('textarea').bind('dragleave', function ()
    {        
        $(this).parent().css('border', '1px solid');
    });
  </script>

＆＃13;

JavaScript：拖放到TextArea

1 个答案: