重置 jquery 可拖动元素
Posted
技术标签:
【中文标题】重置 jquery 可拖动元素【英文标题】:Reset jquery draggable elements 【发布时间】:2018-04-24 11:45:08 【问题描述】:我想将列表中的所有元素重置为初始位置。这是我的例子Jquery UI Droppable
这是我的重置功能
$(".reset").click(function()
// Code to reset all elements
);
我该怎么做?
【问题讨论】:
你一定是在开玩笑吧!// Code to reset all elements
是注释,而不是 js 代码,您所做的只是将单击事件基本绑定到具有 reset
类的元素
对于“你的”示例(实际上是 jqueryUI 的演示),您可以destroy 可放置功能并将元素返回到原始状态,然后您可以再次定义可放置原始元素)
如果对您有帮助,请支持并接受我的回答,以便其他人知道这是正确的答案并帮助他们。
【参考方案1】:
您可以使用以下代码:
首先为商品设置订单属性
// This code used for set order attribute for items
var numberOfItems = $("#gallery").find('li').length;
$.each($("#gallery").find('li'), function(index, item)
$(item).attr("order", index);
);
更改recycleImage函数
function recycleImage($item)
$item.fadeOut(function()
$item
.find("a.ui-icon-refresh")
.remove()
.end()
.css("width", "96px")
.append(trash_icon)
.find("img")
.css("height", "72px")
.end()
//.appendTo($gallery)
.fadeIn();
// Add to old palce
addToOlderPlace($item);
);
添加 addToOlderPlace 函数
// This function used for find old place of item
function addToOlderPlace($item)
var indexItem = $item.attr('order');
var itemList = $("#gallery").find('li');
if (indexItem === numberOfItems - 1)
$("#gallery").append($item);
else if (indexItem === "0")
$("#gallery").prepend($item);
else
$(itemList[indexItem - 1]).after($item);
Online demo (fiddle)
【讨论】:
@fray 请为我的答案投票,因为我知道并帮助了其他人,因为有些人只看到投票赞成的答案。以上是关于重置 jquery 可拖动元素的主要内容,如果未能解决你的问题,请参考以下文章
如何使用 jquery ui 使拖动和克隆的元素再次可拖动?