Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Открытие сразу нескольких див-ов при нажатии на ссылку. Как? (https://javascript.ru/forum/dom-window/7666-otkrytie-srazu-neskolkikh-div-ov-pri-nazhatii-na-ssylku-kak.html)

Jameson 13.02.2010 18:27

Открытие сразу нескольких див-ов при нажатии на ссылку. Как?
 
Имеем скрипт, с помощью которого можно "открывать" содержимое блока нажатием на ссылку.

<script language="JavaScript" type="text/javascript">
function show(divid)
{
if(document.getElementById(divid).style.display==" none")
{
document.getElementById(divid).style.display="bloc k";
}
else
{
document.getElementById(divid).style.display="none ";
}
}
</script>

Он замечательно работает и все хорошо, если div с id=x встречается в коде 1 раз.

Но если div-ов с id=x несколько, то открывается только тот, который "попадется" первым.

Уважаемые специалисты, помогите со скриптом, который бы открывал все div-ы с нужным мне id, если такое возможно.

<div>
<div id="sub" style="DISPLAY: none;">
<div class="a1">
1.1
</div>
<div class="a1">
1.2
</div>
</div>

<div id="sub" style="DISPLAY: none">
<div class="a1">
2.1
</div>
<div class="a1">
2.2
</div>
</div>

<div id="sub" style="DISPLAY: none">
3
</div>

</div>

<div>
<a onclick="show('sub');" href="#">Скрытый DIV</a>
</div>

Gozar 14.02.2010 09:47

id - это уникальный идентификатор. Нельзя нескольким элементам присваивать один и тот же id.

можно например присвоить id = 'sub-0',id = 'sub-1',id = 'sub-2', а в функции просто пройтись for:

function show(divid)
{
for(var i=0;i<3;i++){
if(document.getElementById(divid+i).style.display==" none")
{
document.getElementById(divid+i).style.display="bloc k";
}
else
{
document.getElementById(divid+i).style.display="none ";
}
}
}

решение не идеальное, но должно дать пищу для размышлений.

Jameson 15.02.2010 09:07

<html>
<head>
<script>
function show(divid)
{
for(var i=0;i<5;i++){
if(document.getElementById(divid+i).style.display= ="none")
{
document.getElementById(divid+i).style.display="bl ock";
}
else
{
document.getElementById(divid+i).style.display="no ne";
}
}
}
</script>
</head>

<body>
<div>
<div id="sub-0" style="display:none">111</div>
<div id="sub-1" style="display:none">222</div>
<div id="sub-2" style="display:none">333</div>
<div id="sub-3" style="display:none">444</div>
<div id="sub-4" style="display:none">555</div>
</div>
<div>
<a onclick="show('sub');" href="#">Скрытый DIV</a>
</div>

</body>
</html>

Сделал, но дивы вообще не раскрываются. Возможно ошибка в ЯС-коде?

Jameson 15.02.2010 11:02

<html>
<head>
<script>
function show(divid)
{
for(var i=1;i<100;i++)
{
if(document.getElementById(divid+i).style.display= ="none")
{
document.getElementById(divid+i).style.display="bl ock";
}
else
{
document.getElementById(divid+i).style.display="no ne";
}
}
}
</script>
</head>

<body>
<div>
<div id="1" style="display:none">111</div>
<div id="2" style="display:none">222</div>
<div id="3" style="display:none">333</div>
<div id="4" style="display:none">444</div>
<div id="5" style="display:none">555</div>
</div>
<div>
<a onclick="show('');" href="#">Скрытый DIV</a>
</div>

</body>
</html>

Нашел причину, теперь все работает, но в ИЕ6.0 пишет ошибку
строка 8 символ 1 требуется объект Код 0

Кто-нибудь, помогите, пожалуйста.

JsLoveR 15.02.2010 22:03

Так тут прилично ошибок было):
function show(divid)
{
for(var i=1;i<=5;i++) // была ошибка, у Вас 5 дивов, а не 100
{
if(document.getElementById(divid+i).style.display=="none") // была ошибка "= ="
{
document.getElementById(divid+i).style.display="block"; //была ошибка "bl ock"
}
else
{
document.getElementById(divid+i).style.display="none"; //была ошибка "no ne"
}
}
}

<div>
<div id="1" style="display:none">111</div>
<div id="2" style="display:none">222</div>
<div id="3" style="display:none">333</div>
<div id="4" style="display:none">444</div>
<div id="5" style="display:none">555</div>
</div>
<div>
<a onclick="show('');" href="#">Скрытый DIV</a>
</div>


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