Блог

Вероятно, лучше всего объяснить на примере:

 <div id="tab-1">
  <input name="1" type="text" />
  <input name="2" type="text" />
  <input name="3" type="text" />
<div>
<div id="tab-2">
  <input name="4" type="text" />
  <input name="5" type="text" />
  <input name="6" type="text" />
<div>
  

Я использую инструмент Jquery Tools «Вкладки». Это переключает видимость двух приведенных выше разделов, так что одновременно отображается только один.

Проблема заключается в следующем:

1. Пользователь переключается на вкладку 2. Это скрывает вкладку-1 и поля с 1 по 3. Здесь также отображаются tab-2 и его дочерние элементы, поля с 4 по 6.

2. Пользователь выполняет действие на вкладке-2, которое должно удалить поле 2 из скрытой вкладки-1. Я использую $('#field-2').hide(0);

Это должно скрыть второе поле, но ничего не делает, поскольку второе поле уже скрыто. Пока все в порядке.

3. Пользователь переключается обратно на вкладку-1.

Фактический результат: все три поля, включая поле 2, теперь снова видны.

Желаемый результат: поля 1 и 3 теперь видны, но переключение на tab-1 не отменяет скрытие поля 2, поскольку оно было явно скрыто функцией. Поле 2 должно оставаться скрытым до тех пор, пока оно явно не будет показано.

Я думаю, что смогу обойти это, назначив специальный класс css полю с помощью display:none; , но мне было интересно, есть ли лучшее решение для отображения / скрытия независимо от вкладки, на которой находится элемент, без назначения дополнительных классов css.

Похоже, это работает, если вы действительно измените display стиль элемента, вместо того чтобы использовать hide :

 $('selector').css('display', 'none');