Jquery UI 可排序 - 在启动事件触发之前执行操作

标签 jquery jquery-ui draggable jquery-ui-sortable helper

我已经在 STACKOVERFLOW 和其他论坛中搜索了我的问题的解决方案 - 如果我错过了可行的解决方案,请指出它。

我的问题: 每当在可排序列表中拖动元素(Portlet div)时,我需要在实际拖动过程开始之前执行一些操作(根据我在 START 事件触发之前的理解)。

更具体地说: 我的 DIV 为用户提供了扩展/折叠其主体的可能性(就像 jquery UI 页面 http://jqueryui.com/demos/sortable/#portlets 中的示例所示)。

每当拖动一个元素时,我都想触发我的折叠方法,以便唯一被拖动的视觉元素是折叠的 DIV。

但是每当我调用我的方法(类似这样)

$someitem.trigger("toggle.somenamespace") 

它按预期工作,除了在可排序中触发开始事件之前计算拖动的助手的高度,因此助手在未折叠状态下具有原始元素的高度。

我对此的最初想法是:因为可排序具有例如在实际拖动过程开始之前测量拖动距离的可能性(使用选项:距离)应该可以 Hook 到此流程,例如存储原始的startDrag函数(或无论它被称为什么)临时变量中的可排序小部件,使用自定义回调覆盖它,该回调首先触发我的折叠功能,然后调用原始函数以确保正确计算高度。 然而,到目前为止,我的这种方法并没有取得太大成功......

请注意,在拖动处理程序中或在可排序事件上设置 CSS 属性不会达到预期的效果,因为为帮助器计算的可排序小部件的高度被设置为元素属性。

或者 - 可能有人知道更好的方法来影响拖动过程中显示的助手的高度,这只是我的观点,我原来的方法(在拖动过程之前更改元素,然后让小部件执行其操作)按照其意图的方式进行计算)将是一个更好的解决方案......

感谢您的帮助, 马蒂亚斯

编辑: 将可排序标志:forceHelperSize 设置为 true 并在启动拖动处理程序中设置 ui.item/helper 大小也不起作用,因为它会在视觉上产生所需的效果(仅拖动折叠的项目,但会阻止元素被向下拖动)一直(就好像该项目仍然具有未折叠状态下的高度) 使用助手进行测试:“原始”和“克隆”

最佳答案

我已经搜索了很长时间来寻找这个“解决方案”:

$('.handle').each(function() {
    $(this).mousedown(function() {
        $(this).parent().parent().children('ol').hide('blind', 500);
    });
});

您可以通过鼠标按下 handle 来触发事件并隐藏您想要的任何内容。然后将可排序的选项延迟设置为大于隐藏动画持续时间的值,在我的示例中为 501。

这不是一个优雅的解决方案,但它有效 - 至少在我的程序中。

关于Jquery UI 可排序 - 在启动事件触发之前执行操作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9804238/

相关文章:

jquery - 如何使用jQuery在YouTube URL中的YouTube ID后分隔多余的文本?

javascript - 使用 jquery mouseover 在 javascript 中递归过多

javascript - JS/jQuery : Copying Contents of td to clipboard

jQuery 在 Over 和 Out 上具有可拖动/可放置行为

jquery克隆似乎没有保留可拖动/可放置事件

javascript - jQuery UI 可排序连接列表 css 问题

jquery - 每 4 个数字间隔开

javascript - Jquery 淡出速度不适用

jquery - 有没有像 drupal 分类术语这样的 jquery 排序插件

javascript - 你能用 JavaScript 判断一个元素是否与另一个元素接触吗?