【问题标题】:jQuery-ui sortable draggable modules running into multiple problems?jQuery-ui sortable draggable modules 遇到多个问题?
【发布时间】:2023-03-25 21:50:01
【问题描述】:

(综上,我的问题可以看这里:http://jsfiddle.net/F5Wve/12/

所以我正在尝试修复我正在与我的朋友 FriendGrid 合作的网站上运行的代码 ,我们正在使用 jQuery-UI 在三列界面中添加可排序模块,不幸的是我的代码遇到了一些奇怪的错误,当我使用这个 jQuery 为排列在列内的模块启动可拖动界面时与 connectWith 连接它会遇到模块在移动后克隆自己的问题,而它们应该只被移动:

$(".module").draggable({
    handle: $(this).children(".draghandle"),
    opacity: 0.5,
    helper: 'clone',
    revert: 'invalid',
    connectToSortable: '.column'
});

然后当我使用下一个代码来启动它而不是克隆模块时,它起初看起来像是要移动它,但后来它完全删除了它:

$(".module").draggable({
    handle: $(this).children(".draghandle"),
    opacity: 0.5,
    helper: 'original',
    revert: 'invalid',
    connectToSortable: '.column'
});

所以无论哪种方式,它都忽略了移动它,因为人们可能会注意到我更改的选项是助手,这也是所有这一切的主要因素,但如果助手是一个克隆,它应该只使用一个克隆本身被拖动,如果它设置为原始,它应该将模块完全移出它所在的位置并拖动模块本身,但我不明白为什么它会导致这些奇怪的问题,当前设置站点是克隆的,但是您当然必须创建一个帐户才能对其进行测试,如果您希望可以立即删除该站点,并且一旦进入该站点,就需要调用 javascript 函数 ModularMode() ,如果您不知道如何通过输入“javascript: ModularMode();”轻松完成进入您的浏览器(不带引号)。希望能得到一些有用的回复,谢谢。

【问题讨论】:

  • 如果您可以将您的问题归结为可以在jsfiddle.net 上发布的示例,您的问题可能会得到更多关注

标签: javascript jquery jquery-ui jquery-ui-sortable jquery-ui-draggable


【解决方案1】:

对于它的价值,您通过声明您的元素既可拖动又可排序来重复工作。 Sortables 具有所有相同的选项,因此您也可以在此处指定它们。您在脚本中遇到这么多麻烦的原因可能是表格单元格往往会与库用来创建您想要的行为的 CSS 定位属性类型产生问题。我什至无法开始推测克隆。但是,我已经设法通过使用稍微不同的标记(无序列表)和元素定位来完成您尝试做的事情。您可以轻松地使用包装其他 div 的 div,但是将所有列容器浮动到左侧,它应该可以正常工作。 Check out the example fiddle.

与许多可排序元素一样,被拖动的元素并不总是很容易捕捉到列表的底部,但它是可行的。您需要为列指定 width 和 min-height 属性,这样当您从中拖动所有元素时它们不会消失。

【讨论】:

  • 谢谢,原来是双重声明导致了重复 XD,把它全部放在一个声明中解决了我的大部分问题 :)
猜你喜欢
  • 2011-09-18
  • 1970-01-01
  • 2011-07-26
  • 1970-01-01
  • 2017-10-29
  • 2011-07-12
  • 2012-01-14
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多