Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
PHP Puzzles. Авторы: Кузнецов М.В., Симдянов И.В. Программирование. Ступени успешной карьеры. Авторы: Кузнецов М.В., Симдянов И.В. Самоучитель MySQL 5. Авторы: Кузнецов М.В., Симдянов И.В. Самоучитель PHP 5 / 6 (3 издание). Авторы: Кузнецов М.В., Симдянов И.В. MySQL 5. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум Структурный форум

тема: Как обратиться к нескольким элементам?
 
 автор: Киналь   (26.11.2005 в 22:07)   письмо автору
 
 

Есть несколько элементов - таблиц. Требуется скрыть их все разом, по одному событию. Пытался писать одинаковые id и делать document.getElementById('table_id').style.display='none' - скрывает только первый элемент.
Так что сабж - как скрыть сразу несколько элементов?

   
 
 автор: codexomega   (27.11.2005 в 00:09)   письмо автору
 
   для: Киналь   (26.11.2005 в 22:07)
 

Все работает:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />

<script language="javascript">
function hideElements(){ 
    document.getElementById("table1").style.display = 'none';
    document.getElementById("table2").style.display = 'none';

function unhideElements(){
    document.getElementById("table1").style.display = 'block';
    document.getElementById("table2").style.display = 'block';
}

</script>
</head>

<body>
<form name="frm_data" action="" method="post">
<input name="btn_hide" type="button" value="Hide"  onclick="hideElements()"/>
<input name="btn_hide" type="button" value="UnHide"  onclick="unhideElements()"/>
<table id="table1" width="100%"  border="1" cellspacing="0" cellpadding="0">
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<table id="table2" width="100%"  border="1" cellspacing="0" cellpadding="0">
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>

</form>
</body>
</html>

   
 
 автор: 12345   (27.11.2005 в 01:25)   письмо автору
 
   для: Киналь   (26.11.2005 в 22:07)
 

Конечно, надо писать разные id, потому что смысл их - уникальный идентификатор.

   
 
 автор: Киналь   (27.11.2005 в 11:19)   письмо автору
 
   для: 12345   (27.11.2005 в 01:25)
 

Так в том-то вся и проблема - число скрываемых элементов заранее неизвестно. Их может быть и пять, и десять, и двадцать.

   
 
 автор: 12345   (27.11.2005 в 15:16)   письмо автору
 
   для: Киналь   (27.11.2005 в 11:19)
 

Вы - хозяин своих решений, как сделаете, так и будет. Можно поставить в общий слой и его скрывать разом, можно присвоить заранее неизвестным (??) элементам класс и выбрать все одного класса, можно вести список скрываемых.

   
 
 автор: Киналь   (27.11.2005 в 15:43)   письмо автору
 
   для: 12345   (27.11.2005 в 15:16)
 

Ну, зачем же столько иронии? Если б я знал, как сделать, я бы, наверное, не спрашивал.
Элементы действительно заранее неизвестны, не удивляйтесь. Это сообщения в гостевой, причем они двух типов - имеющие ответ админа и не имеющие такового. Ясен пень, заранее не узнаешь. на что админ станет отвечать, а на что нет. Скрыть же надо все "неотвеченные". Теперь, думаю, уже не столь удивительно.

Однако по делу.

>можно присвоить
>заранее неизвестным (??) элементам класс и выбрать все
>одного класса

Думаю, это-то мне и нужно. Как это сделать?

   
 
 автор: Crux   (27.11.2005 в 20:07)   письмо автору
 
   для: Киналь   (27.11.2005 в 15:43)
 

хм... если Вы можете определить на какие сообщения ответил админ, то мне не понятно, что именно Вас затрудняет скрыть эти сообщения.

   
 
 автор: Киналь   (27.11.2005 в 22:31)   письмо автору
 
   для: Crux   (27.11.2005 в 20:07)
 

Эх-х, видно, плохо у меня получается спрашивать...
Да, я могу определить нужные мне сообщения, могу им всем дать одинаковую метку - класс, или id, или еще чего-нибудь. Могу даже разные - присваивать нужным сообщениям порядковые номера в цикле вывода сообщений. Но как средствами JS все эти "меченые" скрыть? Тут предложили присваивать класс, и скрывать все элементы этого класса. Думаю, это выход. Но как это сделать? getElementByClass вряд ли существует=)

   
 
 автор: 12345   (28.11.2005 в 02:08)   письмо автору
 
   для: Киналь   (27.11.2005 в 22:31)
 

Вот так в IE:
for(i in d.all.tags('table'))if(d.all[i].className=='помеченные')with(d.all[i]){скрыть;}

   
 
 автор: Киналь   (29.11.2005 в 23:16)   письмо автору
 
   для: 12345   (28.11.2005 в 02:08)
 

Нет, все-таки я танкист... Ничего не получилось из вставки этого кода. Получал одно за другим требования исправить синтаксис, а под конец - ни сообщений, ни результатов=)
Словом, огромная просьба - все-таки написать поподробнее, идеально - вообще функцию.
Но только одно уточнение - если вообще моя идея осуществима только в ИЕ, то скажите, пожалуйста, об этом - лучше не буду делать вообще.

   
 
 автор: 12345   (30.11.2005 в 04:19)   письмо автору
 
   для: Киналь   (29.11.2005 в 23:16)
 

Это ещё не код, а его скелет, идея. Русские слова там, конечно, заменяете на коды, зависящие от вашего контекста (и d=document; ).

На соседнем сайте я привёл недавно кроссбраузерное решение с сокрытием группы таблиц - http://forum.vingrad.ru/index.php?showtopic=71995 - там скрывается группа, а затем включается одна таблица с целью сделать навигацию по слоям. Вот эта строчка -
>> for(i=0;i<d.getElementsByTagName('pre').length;i++)d.getElementById('someText'+i).className='';
как раз выполняет скрывание. Возможно, пример поможет.

   
 
 автор: Киналь   (30.11.2005 в 18:14)   письмо автору
 
   для: 12345   (30.11.2005 в 04:19)
 

Спасибо, уже понятнее=) Но все равно не все ясно, к сожалению. Что есть someText?

   
 
 автор: 12345   (30.11.2005 в 19:18)   письмо автору
 
   для: Киналь   (30.11.2005 в 18:14)
 

См. код по ссылке

   
 
 автор: Киналь   (01.12.2005 в 20:31)   письмо автору
 
   для: 12345   (30.11.2005 в 19:18)
 

Проблемы остались... Подогнал под себя, получил вот что:

<script>
d=document;
function hide_admin()
    {
     for(i=1;i<d.getElementsByTagName('table').length;i++)d.getElementById('trash'+i).style.display='none';
    }
function show_admin()
    {
     for(i=1;i<d.getElementsByTagName('table').length;i++)d.getElementById('trash'+i).style.display='';
    }
</script>


Но проблема в том, что в цикле берется i от единицы до числа тегов table на странице, и столько раз ищется id='trash'+i. Естественно, это приводит к ошибке, так как таблиц с id такого вида меньше. Проще говоря:

<table ...> <!--ID вообще нет-->
<table id=trash1 ...>
<table id=trash2 ...>
<table ...> <!--ID вообще нет-->
<table id=trash3>

Вот он и ищет trash4 и trash5, которых не существует.

В принципе, можно подставлять в условие цикла нужное число средствами РНР, но тогда придется использовать буфер и вообще усложнять код. Посему вопрос: можно ли подсчитать число тегов table, вообще имеющих id?

   
 
 автор: 12345   (01.12.2005 в 21:58)   письмо автору
 
   для: Киналь   (01.12.2005 в 20:31)
 

Можно подсчитать, но в данном случае надо выделить теги по признаку. Поэтому пишем условие выделения:
<script>d=document; 
function hide_admin() 
    { 
     for(i=1;i<d.getElementsByTagName('table').length;i++)if(d.getElementById('trash'+i))d.getElementById('trash'+i).style.display='none'; 
    } 
function show_admin() 
    { 
     for(i=1;i<d.getElementsByTagName('table').length;i++)if(d.getElementById('trash'+i))d.getElementById('trash'+i).style.display=''; 
    } 
</script> 
 <br><a href=# onclick=hide_admin()>Hide</a> . . . <a href=# onclick=show_admin()>Show</a>
<table ...>  <tr><td>1</td></tr></table><!--ID вообще нет--> 
<table id=trash1 ...>  <tr><td>2</td></tr></table>
<table id=trash2 ...>  <tr><td>3</td></tr></table>
<table ...> <tr><td>4</td></tr></table> <!--ID вообще нет--> 
<table id=trash3> <tr><td>5</td></tr></table>

   
 
 автор: Киналь   (02.12.2005 в 20:47)   письмо автору
 
   для: 12345   (01.12.2005 в 21:58)
 

Большое спасибо! Все прекрасно работает, и под ИЕ, и под Оперу.

Еще, по мелочи: какие события возникают при отметке/снятии галочки на <input type=checkbox>?

   
 
 автор: Киналь   (29.11.2005 в 23:19)   письмо автору
 
   для: 12345   (28.11.2005 в 02:08)
 

.

   
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования