Форум программистов, компьютерный форум, киберфорум
JavaScript для начинающих
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.91/11: Рейтинг темы: голосов - 11, средняя оценка - 4.91
0 / 0 / 0
Регистрация: 05.09.2017
Сообщений: 25

Скрывать различные блоки, в зависимости от значения скрытого поля

01.03.2018, 12:11. Показов 2480. Ответов 6
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Здравствуйте.


Есть скрытый инпут (id = "flag")


Если в нем имеется текст "Пользователь", то нужно скрыть 1,2 и 3 блоки, а если текст "Сотрудник", то скрыть 2 блок, если же "Админ" , то ничего не скрывать
Миниатюры
Скрывать различные блоки, в зависимости от значения скрытого поля  
0
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
01.03.2018, 12:11
Ответы с готовыми решениями:

По клику по кнопке отображать / скрывать таблицу, в зависимости от значения кнопки.
atanov, а можно, может быть глупый вопрос, но все-таки: есть кнопка <button class="button button--show"...

Вывод скрытого поля формы в зависимости от результата другой формы
Есть форма (PHP+JavaScript), значения для некоторых полей определяются формой из другой страницы: echo '<form enctype=...

Как реализовать автозаполнение поля в DbGrid в зависимости от значения другого поля
Добрый день. Не могу разобраться в автозаполнением поля в gdgride. Суть проблемы, имеется у меня таблица в которой есть поле...

6
Эксперт JSЭксперт HTML/CSS
2151 / 1496 / 651
Регистрация: 16.04.2016
Сообщений: 3,696
01.03.2018, 15:03
Лучший ответ Сообщение было отмечено Sergey21645 как решение

Решение

Цитата Сообщение от Sergey21645 Посмотреть сообщение
Есть скрытый инпут (id = "flag")

Ну ладно, скрытый так скрытый... Песочница
HTML5
1
2
3
4
5
6
<input type="text"/>
<div>Опции</div>
<div>Отчет</div>
<div>Добавить сотрудника</div>
<div>Добавить пользователя</div>
<div>Выйти</div>
CSS
1
2
input{display:none}
div{display:inline-block;margin-left:20px}
JavaScript
1
2
3
4
5
//строка ниже - меняем значения "Пользователь","Сотрудник","Админ"
document.querySelector('input').value="Сотрудник"
//- логика
if(document.querySelector('input').value=="Пользователь"){for(var i=1;i<document.querySelectorAll('div').length-1;i++){document.querySelectorAll('div')[i].style.display='none'}}
if(document.querySelector('input').value=="Сотрудник"){document.querySelectorAll('div')[2].style.display='none'}
1
0 / 0 / 0
Регистрация: 05.09.2017
Сообщений: 25
02.03.2018, 17:53  [ТС]
Спасибо за ваш ответ. А возможно это переделать под id?

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
                               <div class="ss1" onClick="document.location='option.php'">
                    <div class="pp1">
                        опции
                    </div>
                </div>
 
                <div class="ss2" id="otchet" onClick="document.location='otchet.php'">
                    <div class="pp1">
                        отчет
                    </div>
                </div>
 
                <div class="ss3">
                    <div class="pp1" onClick="document.location='logout.php'">
                        выйти
                    </div>
                </div>
 
                <div class="ss4">
                    <div class="pp2"  id="adduser" onClick="document.location='adduser.php'">
                        добавить пользователя
                    </div>
                </div>
 
                <div class="ss5">
                    <div class="pp2"  id="addsotr" onClick="document.location='addsotr.php'">
                        добавить сотрудника
                    </div>
0
Эксперт JSЭксперт HTML/CSS
2151 / 1496 / 651
Регистрация: 16.04.2016
Сообщений: 3,696
02.03.2018, 20:29
Лучший ответ Сообщение было отмечено Sergey21645 как решение

Решение

Sergey21645, песочница
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<input id="flag" type="text"/>
<div class="ss1" onclick="document.location='option.php'">
  <div class="pp1">опции</div>
</div>
<div class="ss2" id="otchet" onclick="document.location='otchet.php'">
  <div class="pp1">отчет</div>
</div>
<div class="ss3">
  <div class="pp1" onclick="document.location='logout.php'">выйти</div>
</div>
<div class="ss4">
  <div class="pp2" id="adduser" onclick="document.location='adduser.php'">добавить пользователя</div>
</div>
<div class="ss5">
  <div class="pp2" id="addsotr" onclick="document.location='addsotr.php'">добавить сотрудника</div>
</div>
CSS
1
input{display:none}
JavaScript
1
2
3
4
5
6
//строка ниже - меняем значения "Пользователь","Сотрудник","Админ"
document.querySelector('input').value="Сотрудник"
//- логика
var watchingArr=[otchet,adduser,addsotr];
if(flag.value=="Пользователь"){for(var i=0;i<watchingArr.length;i++){watchingArr[i].style.display='none'}}
if(flag.value=="Сотрудник"){addsotr.style.display='none'}
1
0 / 0 / 0
Регистрация: 05.09.2017
Сообщений: 25
03.03.2018, 05:17  [ТС]
Работает, но только через "ручной запуск", т.е. через "простой редактор js" в mazilla.

Как сделать чтобы он сам срабатывал при обновлении страницы?
0
Эксперт JSЭксперт HTML/CSS
2151 / 1496 / 651
Регистрация: 16.04.2016
Сообщений: 3,696
03.03.2018, 06:37
Sergey21645,
PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<style>
    input{display:none}
 
</style>
</head>
<body>
    <input id="flag" type="text"/>
<div class="ss1" onclick="document.location='option.php'">
  <div class="pp1">опции</div>
</div>
<div class="ss2" id="otchet" onclick="document.location='otchet.php'">
  <div class="pp1">отчет</div>
</div>
<div class="ss3">
  <div class="pp1" onclick="document.location='logout.php'">выйти</div>
</div>
<div class="ss4">
  <div class="pp2" id="adduser" onclick="document.location='adduser.php'">добавить пользователя</div>
</div>
<div class="ss5">
  <div class="pp2" id="addsotr" onclick="document.location='addsotr.php'">добавить сотрудника</div>
</div>
<script>
    //строка ниже - меняем значения "Пользователь","Сотрудник","Админ"
document.querySelector('input').value="Сотрудник"
//- логика
var watchingArr=[otchet,adduser,addsotr];
if(flag.value=="Пользователь"){for(var i=0;i<watchingArr.length;i++){watchingArr[i].style.display='none'}}
if(flag.value=="Сотрудник"){addsotr.style.display='none'}
</script>
</body>
</html>
0
0 / 0 / 0
Регистрация: 05.09.2017
Сообщений: 25
03.03.2018, 08:21  [ТС]
Огромное спасибо!
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
03.03.2018, 08:21
Помогаю со студенческими работами здесь

Разветвляющий алгоритм: вычислить различные выражения в зависимости от значения функции
В качестве f(x) использовать по выбору: Sin(x), Cos(x) или Tg(x). При исходных данных, когда задача не имеет решения, предусмотреть...

Отображение поля в зависимости от значения другого поля
Уважаемые знатоки, имею такую ситуацию поле №1 имеет выбор по выпадающему списку из двух значений: 'однократная' и 'двукратная' ...

Динамические формы (в зависимости от категории отображать различные поля формы)
Добрый день! У кого был опыт реализации подобной функциональности, в зависимости от категории, отображать различные поля формы. Прошу...

Как скрывать блоки, которые перемещаются за пределы контейнера?
Доброго времени суток! Помогите, пожалуйста, решить задачу. Я вставил в контейнер div, от левой до правой стороны блоки div,...

Изменение цвета поля в зависимости от значения
Как в ленточной или табличной форме (Access 2000) при помощи VBA подсветить поле, в зависимости от его значения (больше или меньше 0)? ...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
7
Ответ Создать тему
Новые блоги и статьи
http://iceja.net/ сервер решения полиномов
iceja 18.01.2026
Выкатила http:/ / iceja. net/ сервер решения полиномов (находит действительные корни полиномов методом Штурма). На сайте документация по API, но скажу прямо VPS слабенький и 200 000 полиномов. . .
Первый деплой
lagorue 16.01.2026
Не спеша развернул своё 1ое приложение в kubernetes. А дальше мне интересно создать 1фронтэнд приложения и 2 бэкэнд приложения развернуть 2 деплоя в кубере получится 2 сервиса и что-бы они. . .
Расчёт переходных процессов в цепи постоянного тока
igorrr37 16.01.2026
/ * Дана цепь постоянного тока с R, L, C, k(ключ), U, E, J. Программа составляет систему уравнений по 1 и 2 законам Кирхгофа, решает её и находит: токи, напряжения и их 1 и 2 производные при t = 0;. . .
Восстановить юзерскрипты Greasemonkey из бэкапа браузера
damix 15.01.2026
Если восстановить из бэкапа профиль Firefox после переустановки винды, то список юзерскриптов в Greasemonkey будет пустым. Но восстановить их можно так. Для этого понадобится консольная утилита. . .
Изучаю kubernetes
lagorue 13.01.2026
А пригодятся-ли мне знания kubernetes в России?
Сукцессия микоризы: основная теория в виде двух уравнений.
anaschu 11.01.2026
https:/ / rutube. ru/ video/ 7a537f578d808e67a3c6fd818a44a5c4/
WordPad для Windows 11
Jel 10.01.2026
WordPad для Windows 11 — это приложение, которое восстанавливает классический текстовый редактор WordPad в операционной системе Windows 11. После того как Microsoft исключила WordPad из. . .
Classic Notepad for Windows 11
Jel 10.01.2026
Old Classic Notepad for Windows 11 Приложение для Windows 11, позволяющее пользователям вернуть классическую версию текстового редактора «Блокнот» из Windows 10. Программа предоставляет более. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru