Question

我发现stack option的{{1}}非常有用，但只有当我拖动元素时它才有用。所以，我可以更改{I}时可拖动的元素JQuery UI draggable stack value或 **click the elements** ??

非常感谢~~ !!

可拖动插件更改可拖动元素堆栈[z-index]顺序的方式是拖动和移动元素。如果你只点击可拖动元素它不会改变堆栈顺序。我想要它点击时更改。

Answer 1

这不适合你吗？

$(element).mousedown(function(){
    ...
})

Answer 2

注意查看我对您的问题的评论，我认为我写这篇文章的时候都误解了。

如果您希望在拖动过程中确保拖动的项目始终高于其他项目，则可以在与您的拖动项匹配的选择器中设置z-index ~~与类{{1 }}。 jQuery UI将该类添加到拖动操作期间被拖动的元素。~~

例如，假设您正在拖动名为ui-draggable-dragging的div中的跨距。 CSS将是：

foo

Live example

由于只在拖动过程中添加了类，因此#foo span.ui-draggable-dragging { z-index: 1000 !important; /* Sadly, you may need the !important */ }值仅在拖动过程中生效。请参阅the docs中的“概述”。

修改：...使用the zIndex option（live example）。

Answer 3

您可以在可拖动插件（jsfiddle）之后放置以下代码：

(function ($) {
    var _create =  $.ui.draggable.prototype._create;

    $.ui.draggable.prototype._create = function () {
        var self = this;

        self.element.mousedown(function (e) {
            self._mouseStart(e);
            self._trigger('start', e);
            self._clear();
        });

        _create.call(self);
    };
})(jQuery);

或者，您可能希望将其变为单独的选项，如下所示（jsfiddle）：

(function ($) {
    $.ui.plugin.add('draggable', 'increaseZindexOnmousedown', {
        create: function () {
            this.mousedown(function (e) {
                var inst = $(this).data('draggable');
                inst._mouseStart(e);
                inst._trigger('start', e);
                inst._clear();
            });
        }
    });
})(jQuery);

Answer 4

因为我在搜索时发现了这个问题，我想我会发布我找到的答案。单击不会更改z-index的原因是拖动尚未启动。要强制在所有点击上启动拖动，请将距离选项设置为0：

http://docs.jquery.com/UI/Draggable#option-distance

行为与默认行为几乎相同，但现在即使没有鼠标移动，z顺序也会发生变化。

mousedown时是否可以更改可拖动元素的z-Index？

4 个答案: