我想根据 dragend
事件坐标追加 div。这是我尝试过的:
$(document).ready(function () {
var mouseX;
var mouseY;
$(document).mousemove(function (e) {
mouseX = e.pageX;
mouseY = e.pageY;
});
var i =1;
$(".ic_table").on("dragend", function (e, ui)
{
console.log(mouseX + " " + mouseY);
var editName = "Edit Name";
$('#datamodelArea').append('<div id="divDT' + i++ + '" class="dataModelTable ui-draggable ui-draggable-handle style="left:' + mouseX + 'px' + '; top:' + mouseY + 'px' + ';"><div class="dataTableName">' + editName + '</div><div class="widget"><div class="widget-head"> <a href="#" id="toggle1" class="fa fa-chevron-up fa-1x attributes"><i></i></a> Attributes <div class="widget-body attributesBody" id="widget-body1"></div></div></div><div class="widget-body attributesBody" id="widget-body1"><ul></ul></div></div>');
$('.form-control').val('');
});
});
HTML:
<body>
<div id="datamodelArea"></div>
<button class="ic_table" draggable="true">Submit</button>
</body>
它仅附加到 top:0px
和 left:0px
,即使 dragend 上的鼠标坐标不同
最佳答案
将您的位置属性明确设置为容器的相对位置和放置的位置的绝对位置。
关于javascript - 根据 dragend 鼠标坐标追加 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32515911/