Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Как открыть несколько div-ов, закрывая старые? (https://javascript.ru/forum/misc/79121-kak-otkryt-neskolko-div-ov-zakryvaya-starye.html)

Vovan6996 20.12.2019 16:47

Как открыть несколько div-ов, закрывая старые?
 
Здравствуйте. Имеется код.
<script type="text/javascript">
var show;
function viewdiv(id){
param=document.getElementById(id);
if(param.style.display == "none") {
if(show) show.style.display = "none";
param.style.display = "block";
show = param;
}else param.style.display = "none"
}
</script>




<div>
<a href="javascript:void(0);" onclick="viewdiv('mydiv');"> блок 1</a>
<div>
<a href="javascript:void(0);" onclick="viewdiv('mydiv2');"> блок 2</a>
<div>
<a href="javascript:void(0);" onclick="viewdiv('mydiv3');"> блок</a>

<div>
<a href="javascript:void(0);" onclick="viewdiv('mydiv');viewdiv('mydiv2');"> VSE </a>


<div id="mydiv" style="display:none;"> text 1</div>
<div id="mydiv2" style="display:none;"> text 2</div>
<div id="mydiv3" style="display:none;"> tЕЕ</div>


Нужно. Что бы при нажатие на кнопку vse открывался первый и второй div. (на данный момент он открывает последний)
Самое главное что бы при этом сохранилось закрывание старых div-ов

https://jsfiddle.net/Vovan6996/p75L064r/19/

рони 20.12.2019 18:32

открыть закрыть блоки по id открывашка зависимая
 
Vovan6996,
<!DOCTYPE html>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">

  <script>
var show;

function setStyle(ids, display) {
    ids.forEach(id => document.getElementById(id).style.display = display);
}

function viewdiv(...ids) {
    if (show) {
        if (show.toString() !== ids.toString()) {
            setStyle(show, "none");
            show = ids;
            setStyle(show, "block");
        } else {
            setStyle(show, "none")
            show = null
        }
    } else {
        show = ids;
        setStyle(show, "block");
    }

}
  </script>
</head>
<body>
<div>
<a href="javascript:void(0);" onclick="viewdiv('mydiv');"> блок 1</a></div>
<div>
<a href="javascript:void(0);" onclick="viewdiv('mydiv2');"> блок 2</a></div>
<div>
<a href="javascript:void(0);" onclick="viewdiv('mydiv3');"> блок 3</a></div>

<div>
<a href="javascript:void(0);" onclick="viewdiv('mydiv','mydiv2');"> VSE </a></div>


<div id="mydiv" style="display:none;"> text 1</div>
<div id="mydiv2" style="display:none;"> text 2</div>
<div id="mydiv3" style="display:none;"> text 3</div>
</body>
</html>


Часовой пояс GMT +3, время: 04:08.