Question

我要创建一个这样存储在html文件中的prefdefiend元素列表

示例

Block1 = <div>my Block1</div> saved in block1.html
Block2 = <div>my Block2</div> saved in block2.html

现在，您应该可以将这些元素之一拖动到div上。

在这些“块列表”（由divs制成）的元素的列表中，您将图像视为一种占位符（每个块的唯一性）。

阻止列表

<div class="myblocks" data-parameter1="Block1" data-parameter2="DEF">
<img ...>
</div>

我的js代码是这个

function getBlockContent(parameter1,parameter2)
{
            $.get(parameter2+'/'+parameter1+'.html', function(data) { html=data; }).done(function(){ console.log(html); }); 
            return html;
      }

$(".myblocks").on('dragstart',function(e) {
     console.log("Drag Started - "+$(this).attr('data-parameter1')+" - "+$(this).attr('data-parameter2'));           
});

$('#destinationdiv').on('drop',function(e) {        
   e.preventDefault();  
   e.stopPropagation();
   var newcontent=getContent($(this).attr('data-parameter1'),$(this).attr('data-parameter1'));
   console.log("Drop it - "+$(this).attr('data-parameter1')+" - "+$(this).attr('data-parameter2'));
});

$(".myblocks").on('dragend',function(e) {
            console.log("Drag End - "+$(this).attr('data-parameter1')+" - "+$(this).attr('data-parameter2'));
      });

我如何使用html文件的内容来使用它并将其放置到放置点，而不是从阻止列表开始拖动的图像？

此刻，我还有其他问题，我没有收到drop事件中的参数-我也不知道为什么？ 以这种方式尝试，也失败了

console.log($(e.target).attr('data-parameter1'));
console.log($(e.originalEvent).attr('data-parameter1'));

希望我能解释我想做什么和需要知道什么-非常感谢您的帮助。

拖放如何更改可拖动元素的内容

0 个答案: