javascript - 完全禁用 Jquery UI 小部件

Question

我该怎么做？我需要完全禁用小部件，这意味着应该禁用所有实例，并且在禁用后不能创建更多实例。我尝试搜索，但没有任何结果。

将不胜感激。

编辑:

一个更生动的例子。

例如，我将小部件的三个实例放置在三个元素上。然后我想关闭我的小部件。我调用了一个静态方法 turnOff，这导致a) 禁用所有工作实例b) 如果稍后通过 ajax 调用，则禁止创建该小部件的任何其他实例，即然后我想让它再次工作，所以我调用了 turnOn()。

我的小部件是一个提示 pugin，所以如果用户关闭提示，它们应该在所有地方都关闭，并且应用程序中的某些地方页面的提示部分仍在异步加载。

这正是我需要做的。

Answer 1

答案取决于您的小部件在不活动时是否明显——例如，如果它是悬停时显示的“提示”类型工具提示，那么您需要做的就是在不活动时不显示工具提示。但是，如果它还添加格式以显示提示的位置，您也需要撤消它。

让我们先来看简单的情况——假设我们有一个简单的小部件 filler，当鼠标悬停在元素上时，它只添加一个类 (filled)。然后在全局范围内有一个变量:

enableFiller = true;

然后在您的小部件中检查:

$.widget( "spacedog.filler", {

    _create: function() {
        var progress = this.options.value + "%";
        this.element.hover(
            function() {
                if (enableFiller) { 
                    $(this).addClass("filled");
                }
            },
            function() {
                $(this).removeClass("filled");
            }
        );
    }

});

Fiddle .

请注意，我没有检查 removeClass 中的标志，因为当鼠标悬停在小部件上时小部件可能会被禁用，并且您可能不希望悬停颜色意外地“停留” '.

从那里很容易扩展到您的小部件即使在关闭时也会更改元素的情况。我将把逻辑作为伪代码:

• 创建小部件时，将 base-widget 类添加到元素(即使处于非事件状态)

• 如果小部件处于打开状态，请添加 active-widget 类并执行任何需要的操作

• 要关闭从所有基本小部件中删除 active-widget 类:$(".base-widget").removeClass('active-widget')。您可能还需要对所有元素进行一些其他更改——但它们很容易找到。

• 打开添加 active-widget 类并调整其他一切

您可以将打开/关闭功能嵌入到小部件中，只要它使用全局变量作为标志即可。有关存储全局的其他选项，请参阅此答案:How to declare a global variable in JavaScript?

如果您遇到困难，您可以发布(简化版本)您的小部件代码以及您到目前为止尝试过的内容，有人可能会进一步提供帮助。