【问题标题】:jquery UI sortable: how to leave the original visible until the drop?jquery UI sortable:如何让原始可见直到下降?
【发布时间】:2011-01-10 03:02:06
【问题描述】:

http://jqueryui.com/demos/sortable/ 演示的标准行为中,当您在列表中拖动一个项目时,将在该项目将被放置的位置显示一个占位符元素。

但是,没有指明要丢弃的物品的原始位置。

我想让原始位置在放置之前一直可见,以便视觉反馈类似于 http://jqueryui.com/demos/draggable/#visual-feedback 中描述的“半透明克隆”选项保留原始位置的方式

有什么办法可以用 sortable 做到这一点?

谢谢!

【问题讨论】:

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


    【解决方案1】:

    因此,一种似乎有效的方法(认为这绝对是一种 hack)是传递选项

    start: function (e, ui) { ui.item.show();}

    取消隐藏自动隐藏的原件 (ui.item)。

    而且,更一般地说,可以使用start 函数来修改项目。

    【讨论】:

    • 谢谢。这对我也有帮助
    • 但它在下降时消失了
    • 不错。我还最终在开始时添加了一个类,并在停止时将其删除。然后我设置 css 类的不透明度。我发现这有助于说明哪一个是原始项目。
    【解决方案2】:

    helper: 'clone' 选项将保留您的原始项目,同时创建一个实际由鼠标拖动的新 DOM 元素。 (此外,您可以使用选项opacity: 0.7 在助手上创建“半透明”效果。)

    我不确定您是否需要这个,但如果使用克隆不会自动从列表中删除该项目,您可以使用remove 事件删除从列表中拖出的项目完全 DOM。

    【讨论】:

    • 所以,这就是我认为应该使用“克隆”发生的事情——但是当我设置助手时:“克隆”原件仍然消失。所以也许我应该问:我会错过什么?
    • 仔细看一下,使用“克隆”该项目仍然出现在 DOM 中。但它不显示。我修改了 jquery-ui 包附带的示例以使用helper: 'clone' 选项,您可以在此处查看:brahn.sqprod.com/jq/sortable-example.html
    • 而且,事实上(感谢 Firebug)现在很明显(同样,即使使用 clone 选项)通过将样式设置为 display: none 来隐藏原始文件
    • @brahn link dead : brahn.sqprod.com/jq/sortable-example.html jsfidler 是最好的展示示例 ...
    猜你喜欢
    • 1970-01-01
    • 2014-01-05
    • 1970-01-01
    • 2011-05-10
    • 1970-01-01
    • 1970-01-01
    • 2013-02-18
    • 1970-01-01
    相关资源
    最近更新 更多