jQuery 可拖动元素

发布于 2024-11-16 19:37:25 字数 267 浏览 4 评论 0原文

如何保存可拖动元素，以便下次加载它时，无需再次发出 draggable() 函数。

我认为拥有类 ui-draggable 会自动使元素被识别为可拖动，但我发现情况并非如此。

这是保存的draggble 元素。

<div id="one" class="ui-draggable">test 1 </div>

我是否必须再次发出draggable()函数才能使其可拖动。

原文

How do i save a draggable element so the next time i load it, i don't have to issue the draggable() function again.

I thought having the class ui-draggable will automatically make the element get recognized as draggable but i see that's not the case.

This is the saved draggble element.

<div id="one" class="ui-draggable">test 1 </div>

Do i have to issue the draggable() function again to make it draggable.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

﹏半生如梦愿梦如真 2024-11-23 19:37:25

简短的回答是：是的，每次页面加载时都必须调用draggable。我只会在就绪事件中调用它。这是典型的做法。

回复收藏 0 原文

垂暮老矣 2024-11-23 19:37:25

你总是必须发出draggable()。我建议坚持 FishBasket 的回应，然后就去做。

你必须再次这样做的原因是因为它是行为而不是内容。所以这是用JS完成的，而不是HTML。保存 HTML 对您没有帮助，并且您无法“保存”JS 执行 - 您只需要再次运行它。

如果您是受虐狂，您可以通过在鼠标悬停时使用实时事件/委托来对页面上的所有可拖动对象集体执行此操作。但我不建议使用实时鼠标悬停，因为这对于旧浏览器来说是一个性能问题。

$(document).delegate('selectorForDraggables', 'mouseover', function() {
    var $this = $(this); 
    $this.data('isDraggable') || $this.draggable().data('isDraggable', true);
});

这将延迟元素的可拖动调用，直到您将鼠标悬停在该元素上。问题是现在你必须检查鼠标悬停时的每个元素以查看是否进行可拖动调用...

You always have to issue the draggable(). I would suggest sticking with FishBasket's response and just doing it.

The reason you have to do it again is because it's behavior - not content. So it's done with JS, not HTML. Saving the HTML doesn't help you, and you can't "save" the JS execution - you just have to run it again.

If you're masochistic, you can do it collectively for all your draggables on the page though using a live event / delegate on mouseover. But I wouldn't recommend a live mouseover as it's a performance concern for older browsers.

$(document).delegate('selectorForDraggables', 'mouseover', function() {
    var $this = $(this); 
    $this.data('isDraggable') || $this.draggable().data('isDraggable', true);
});

This will delay the draggable call for an element until you mouseover that element. The problem is now you have to check EVERY element onmouseover to see whether to do the draggable call...

回复收藏 0 原文

~没有更多了~