РЕДАКТИРОВАТЬ

---

Поскольку я неправильно читаю свой собственный код, который бы создавал блокировщик для каждого заблокированного элемента, я представляю другое решение, которое принимает селектор в качестве параметра и, таким образом, позволяет создавать виджет один раз и выводит элементы, которые соответствуют селектор. Основываясь на приведенном выше скрипте, в JS есть только изменения: http://jsfiddle.net/DzEFx/1/

(function ($) {
    $.widget('my.blocker', {
        options: {
            selector: null
        },
        _create: function() {
            var selector = this.options.selector || this.element;
            this.$blocker = $('<div/>', {
                css: {
                    backgroundColor: '#000000',
                    opacity: 0.4,
                    position: 'fixed',
                    top: 0,
                    bottom: 0,
                    left: 0,
                    right: 0,
                    zIndex: 99,
                }
            });

            selector.each(function(index) {
                var element = $(this); // the current element is passed as the this value
                var oldZIndex = element.css("z-index");
                element.data("old-z-index", oldZIndex);
                element.css("z-index", 1000);
            });
            this.$blocker.appendTo($('body'));
            return this._super();
        }
    });

    $('#btnBlock').click(function() {
        var anElement = $('.unblocked');
        $(document.body).blocker({selector: anElement});
    });

})(jQuery);

Вы можете видеть, что теперь у виджета есть объект опций, свойства которого можно переопределить как объект, переданный первому аргументу при создании виджета.

СТАРЫЙ ОТВЕТ

---

Вам нужно использовать класс для виджетов, которые вы хотите разрешить быть видимыми, и использовать соответствующий селектор. См. Этот скрипт: http://jsfiddle.net/EQsA7/ Обратите внимание, как нужные элементы имеют class="unblocked" на них, и посмотрите на измененный обработчик нажатия кнопки.

HTML:

<div><input type="text" value="blocked"></div>
<div class="unblocked" id="unblocked1"><input type="text" value="unblocked"></div>
<div><input type="text" value="blocked"></div>
<div class="unblocked" id="unblocked2"><input type="text" value="unblocked"></div>
<div><input type="text" value="blocked"></div>

<input type="button" id="btnBlock" value="Block">

JS:

(function ($) {
    $.widget('my.blocker', {

        _create: function() {
            this.$blocker = $('<div/>', {
                css: {
                    backgroundColor: '#000000',
                    opacity: 0.4,
                    position: 'fixed',
                    top: 0,
                    bottom: 0,
                    left: 0,
                    right: 0,
                    zIndex: 99,
                }
            });

            // this.element will refer to unblocked1
            // I want to access unblocked2 aswell

            this.originalZIndex = this.element.css('z-index');
            this.element.css('z-index', 100);
            this.$blocker.appendTo($('body'));
            return this._super();
        }
    });

    $('#btnBlock').click(function() {
        var anElement = $('.unblocked');
        anElement.blocker();
    });

})(jQuery);