jquery - UI 小部件禁用

Question

我正在创建一个小部件，然后单击按钮，我希望禁用该小部件。

(function ($) {
    $.widget("df.txt", { })
})(jQuery);

$(document).ready(function () {
    //register input widgets
    $("input").txt({ disabled: true });


    //Register button to disable/enable inputs
    $("button").click(function () {
        //$("input").txt("disable");
        $("input").txt("option", "disabled", true);
    });
});

我使用这个链接作为参考。

打不开，有救吗？

Answer 1

disabled基本小部件仅在选项更改时切换某些类。

如果您想真正禁用自定义小部件增强的元素，则必须重写该_setOption()方法并显式执行该操作：

(function($) {
    $.widget("df.txt", {
        _setOption: function(key, value) {
            this._super(key, value);
            if (key == "disabled") {
                this.element.prop("disabled", !!value);
            }
        }
    });
})(jQuery);

然后你可以写这样的东西：

// Register button to disable/enable inputs.
$("button").click(function() {
    var $inputs = $("input");
    $inputs.txt("option", "disabled", !$inputs.txt("option", "disabled"));
});

Answer 2

尝试这个

  $('input').attr("disabled", true);

 or

 $('input').attr("disabled", 'disabled');

在这里，我们将属性 disabled 设置为 true。

Answer 3

_setOption: function (key, value) {

            if (key === "disabled") {
                if (value) { this._Disable(); }
                else { this._Enable(); }
            }

 _Enable: function () {
            this.element.removeAttr("disabled");
            this.element.addClass("enable");
        },

        _Disable: function () {
            this.element.attr("disabled", "disabled");
            this.element.removeClass("enable");
        }