Отображение вкладки только при нажатии и/или нажатии другой вкладки?

У меня есть другой быстрый вопрос. У меня есть набор DIV, которые действуют как вкладки. (Подобно вкладкам jQueryUI). Мой вопрос таков, и он должен содержать короткий и краткий ответ (надеюсь, P).Отображение вкладки только при нажатии и/или нажатии другой вкладки?

Я хочу знать, как изменить существующую JS (см. Ниже), где, когда нажата вкладка с идентификатором # tab-2 или активна (в зависимости от того, что лучше или даже и то и другое, idk), тогда и только после этого, покажите вкладку с идентификатором # tab-4.

Таким образом, когда пользователь нажимает на # tab-2, появляется # tab-4. Если # tab-2 не нажата или не активна, вкладка 4 скрыта.

Я думал, что это будет легко, и, возможно, я над анализом, но вот мой JS:

$(function() { 
if $('#tab-2').click(function() { 
    $('#tab-4').show(); 
    }; 
else $('#tab-4').hide(); 
    }; 
});

});

HTML Update:

НЕ ОБНОВЛЕНИЕ ПОТОМУ КОД РЕДАКТОР SO является ДЕРЬМО ИМО. Посмотрите на https://jqueryui.com/tabs/ для отличной ссылки.

Это хорошо выглядит, все, что я знаю, это не работает по какой-то причине LOL. Любая помощь приветствуется. =)

источник

2014-04-08 user3267537

Лично я бы использовал CSS. Примените класс к родительскому элементу обоих вкладок. '.show-tabs-2-4' отобразит обе вкладки, а' .show-tabs-2' будет конкретной вкладкой. – Jack

@Jack Pattishall Jr .: Продумайте пожалуйста? Может, покажите мне какой-нибудь код? JSFiddle ..? Кроме того, я бы предпочел использовать jQuery, если это поможет любому, но если вы покажете мне достойную альтернативу CSS, я был бы счастлив попробовать ... =) Спасибо заранее ... – user3267537

@ user3267537 это выполнимо в чистом CSS, но он не удобен для пользователя и подразумевает использование дополнительных элементов HTML 'label' и' checkboxes'. Довольно беспорядок. –

Вы были почти там

if $('#tab-2').click(function() { неправильно, а некоторые неуместны ;.

$(function() { // DOM ready shorthand 

    $('#tab-2').click(function() { 
     $('#tab-4').toggle(); 
    });       

});

Это помогло бы также использовать селектор, который указывает на все вкладки, так что, когда вы WAHT первым, чтобы закрыть их все, что вы можете сделать что-то вроде: $('.tab').hide(); // First, hide all...

Видя ваш HTML я бы конечно, дайте вам лучший совет ... До этого.

источник

2014-04-08 02:34:14

Он, похоже, не работает , Я был уверен, что мне нужно будет использовать Boolean для выполнения этого. Butt then again, я все еще приспосабливаюсь к JS и JQ lol. Кроме того, я обновил OP, чтобы показать HTML ... Или https://jqueryui.com/tabs/ может помочь вам в этом. – user3267537

@ пользователь3267537 вы не можете пояснить * что не работает *? Каков ожидаемый результат?Ваш вопрос не совсем понятен. –

Side Note, я не знаком с редактором кода в SO, вы правы lol. Но ожидаемым результатом является то, что Tab 4 скрыт, пока не будет нажата/активна вкладка 2. Если вкладка 2 не активирована/не нажата, то вкладка 4 скрыта от представления. Это означает, что вкладка 4 видна только при нажатии или активации вкладки 1. Вот почему я, хотя и использовал Boolean, чтобы сказать, если нажата вкладка 2, нажимается ID # tab-2, .show # tab-4. Else, .hide # tab-4. Спасибо заранее =) – user3267537

С выбранным ответом ничего не получается, но вы просили меня уточнить :) Вот быстрый скрипт JS, который демонстрирует то, что я предложил.

Во-первых, скрипку: http://jsfiddle.net/GY356/

Основное отличие заключается в том, что вместо того, чтобы использовать JQuery, чтобы показать/скрыть элементы непосредственно (вызывая $(this).show(), $(this).hide() или $(this).toggle()), мы устанавливаем класс на родителя (в нашем case, id щелкнутой вкладки).

источник

2014-04-08 08:38:42 Jack

Отображение вкладки только при нажатии и/или нажатии другой вкладки?

ответ

Смежные вопросы