gpt4 book ai didi

javascript - 如何在 gridster 中的拖动停止事件中获取新的 col 和 row

转载 作者:行者123 更新时间:2023-11-29 10:41:38 24 4
gpt4 key购买 nike

我有 gridster 小部件我想在拖动小部件后有新的 col 和 row 我已经在拖动停止事件中编写了代码,但它默认采用第一个 li,任何人都可以指导我如何使其动态化并获取被拖动的 li

这是我的代码

  $(function () {

$(".gridster ul").gridster({
widget_margins: [10, 10],

widget_base_dimensions: [140, 140],

animate: true,

draggable:
{
enabled: true,
start: function(e, ui, $widget)
{
log.innerHTML = 'START position: ' + ui.position.top + ' ' + ui.position.left + "<br >" + log.innerHTML;
},

drag: function(e, ui, $widget)
{
log.innerHTML = 'DRAG offset: ' + ui.pointer.diff_top + ' ' + ui.pointer.diff_left + "<br >" + log.innerHTML;
},
stop: function(e, ui, $widget)
{
log.innerHTML = 'Stop position: ' + ui.position.top + ' ' + ui.position.left + "<br >" + log.innerHTML;
var newpos = this.serialize($widget)[0];
alert("New col: " + newpos.col + " New row: " + newpos.row);
}
}
});

最佳答案

Gridster 可拖动停止功能:

stop: function (e, ui) {            
var test = ui.$player[0].dataset;
console.log('draggable stop test = ' + JSON.stringify(test));
}

控制台输出:

draggable stop test = {"row":"1","col":"5","sizex":"3","sizey":"7"}

var newrow = ui.$player[0].dataset.row;
var newcol = ui.$player[0].dataset.col;

关于javascript - 如何在 gridster 中的拖动停止事件中获取新的 col 和 row,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27915907/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com