Управление видимостью элементов Web‑страницы

Еще библиотека Ext Core предлагает нам несколько методов объекта Element, позволяющих скрывать элементы Web‑страницы и снова их показывать.

Метод setVisibilityMode позволяет указать, с помощью какого атрибута стиля будет выполняться скрытие и показ данного элемента Web‑страницы: display или visibility. (Эти атрибуты стиля были описаны в главе 9 .)

<экземпляр объекта Element> .setVisibilityMode(<имя атрибута стиля> )

Единственным параметром этому методу передается строка с именем нужного атрибута стиля. Мы можем использовать значения свойств Ext.Element.DISPLAY и Ext.Element.VISIBILITY; первое свойство хранит имя атрибута стиля display, второе – visibility.

Пример:

Ext.get("navbar"). setVisibilityMode(Ext.Element.DISPLAY);

Если метод setVisibilityMode для данного элемента Web‑страницы ни разу не был вызван, для управления видимостью элемента Web‑страницы будет использован атрибут стиля visibility.

Метод setVisible скрывает или снова выводит данный элемент Web‑страницы на экран:

<экземпляр объекта Element> .setVisible(true|false)

Если методу передано значение true, данный элемент Web‑страницы будет выведен на экран, если же передано значение false – он будет скрыт:

Ext.get("navbar"). setVisible(false);

Методы show и hide, соответственно, показывают и скрывают данный элемент Web‑страницы. Они не принимают параметров:

Ext.get("navbar"). show();

Метод toggle скрывает данный элемент Web‑страницы, если он присутствует на экране, и выводит на экран, если он скрыт. Он не принимает параметров:

Ext.get("navbar"). toggle();

Метод isVisible возвращает true, если данный элемент Web‑страницы видим, и false, если невидим. Он не принимает параметров.

Пример:

var elNavbar = Ext.get("navbar");

if (elNavbar.isVisible())

elNavbar.show();

Кроме того, управлять видимостью элемента Web‑страницы можно методом setDisplayed, рассмотренным в предыдущем разделе. Этот метод для скрытия и открытия элемента всегда использует атрибут стиля display.