Javascript 获取元素的位置并创建元素的数组函数

我有大量的div，它们是动态创建的，并随机附加到主体中

var cubes    = [], 
    allCubes  = '',
    $fixed    = $('#fixed'),

for(var i = 0; i < 380; i++) {
    var randomleft = Math.floor(Math.random()*Math.floor(Math.random()*1500)),
        randomtop = Math.floor(Math.random()*Math.floor(Math.random()*1500));
    allCubes += '<div id="cube'+i+'" style="position: absolute; border: 2px #000 solid; left: '+randomleft+'px; top: '+randomtop+'px; width: 15px; height: 15px;"></div>';
    cubes.push($('#cube'+i));
}

但是我不想手工输入380个div的位置。在我将每个div拖动到所需位置后，是否可以自动创建这些函数。意思是制作一个console.log（），我可以从每个

多维数据集[0]

-

多维数据集[379]

---

希望你明白我的意思。

像这样的事？

var cubes = '';
for (var i = 0; i < 380; i++) {
    var rleft = Math.floor(Math.random() * Math.floor(Math.random() * 1500));
    var rtop = Math.floor(Math.random() * Math.floor(Math.random() * 1500));
    $('#content').append('<div class="cube" style="left: ' + rleft + 'px; top: ' + rtop + 'px;"></div>');
}

//defines cubes
var cube = $('.cube');

//drag  get coord
cube.draggable().on('mouseup', function(i) {
    cube.each(function() {
        var nleft = $(this).offset().left;   
        var ntop = $(this).offset().top;
        console.log('['+i+']'+nleft+','+ntop);
    });
});

var-cubes=''；
对于（变量i=0；i<380；i++）{
var rleft=Math.floor（Math.random（）*Math.floor（Math.random（）*1500））；
var rtop=Math.floor（Math.random（）*Math.floor（Math.random（）*1500））；
$（“#内容”）。追加（“”）；
}
//定义多维数据集
变量多维数据集=$（'.cube'）；
//拖到一起
（'mouseup'，函数（i）上的cube.draggable（）{
cube.each（函数（）{
var nleft=$（this）.offset（）.left；
var ntop=$（this）.offset（）.top；
log（'['+i+']'+nleft+'，'+ntop）；
});
});

---

胡闹：

您可以使用API中的停止事件，如（在for中）

---

或者将值存储为带有#cube-id或..的key:value对

希望您知道

Math.random（）

生成的数字介于0和.9之间，而不是1。因此，1500将无法实现。乘以1501得到1500。@PHPglue是的，我知道，只需在其中输入任何数字。非常感谢您的努力。不幸的是，这并不是我想要做的。我不需要在开始位置和新拖动位置之间设置进度动画。我只是用拖动函数来定位div。没有起点，只是我想创建

cubes[0].animate（{top:currentLeftposition，left:currentTopposition}，500）动态地为每个div生成此片段。类似于console.log（），我可以将其复制并粘贴到HTML编辑器中。如果没有，我必须阅读并手动键入380个div的
左上方的
属性。很好的一个，正是我想要的。如果你能让日志完全像
cubes[0]一样，那就太棒了。currentLeftposition/Topposition应该是当前记录的数字！不用担心，这看起来很有趣。我用导出和着色更新了这把小提琴。没有时间添加导入，但这并不完全是一个要求，这会很酷。全屏查看：通过切换到着色模式，单击要着色的单元格，键入
背景色
值，如
rgb（0,0,0）
红色
或
#FF0022
，然后单击按钮按下，即可进行着色。没有重置按钮，所以你必须来回切换，或者松开所有按钮以给不同的单元格着色。mate这太棒了！如果可以的话，我也会接受这个有效的答案。非常感谢你的努力！
var cubes = '';
for (var i = 0; i < 380; i++) {
    var rleft = Math.floor(Math.random() * Math.floor(Math.random() * 1500));
    var rtop = Math.floor(Math.random() * Math.floor(Math.random() * 1500));
    $('#content').append('<div class="cube" style="left: ' + rleft + 'px; top: ' + rtop + 'px;"></div>');
}

//defines cubes
var cube = $('.cube');

//drag  get coord
cube.draggable().on('mouseup', function(i) {
    cube.each(function() {
        var nleft = $(this).offset().left;   
        var ntop = $(this).offset().top;
        console.log('['+i+']'+nleft+','+ntop);
    });
});

$('#cube'+i).draggable({
    stop: function(){
            $(this).attr('data-posX', $(this).offset().left);
            $(this).attr('data-posY', $(this).offset().top);
    }
});