Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 11.04.2011, 13:25
Профессор
Отправить личное сообщение для alexan0308 Посмотреть профиль Найти все сообщения от alexan0308
 
Регистрация: 11.04.2011
Сообщений: 207

Покрасить все ячейки таблицы с заданным id
Здравствуйте! Хочу при клике на ячейке таблицы с определенным id покрасить все ячейки с таким же id. Цвета возвращаются на место при втором клике, или при клике на ячейку с другим id.
Вот подсказал один добрый человек, но че то не работает ))

<script language="JavaScript">
function your_funct(cellId){
var cells = document.getElementsByTag('td');
for (i=0;i<cells.length;i++){>.id==cellId){
cells.style.backgroundColor = 'red';
} else {
cells.style.backgroundColor = 'white';
}
}
}
</script>

Таблица
<table border="1" width="33%">
<tr>
<td id="c1" onClick="your_funct('c1');">Text 1</td>
<td id="c1" onClick="your_funct('c1');" >Text 2</td>
</tr>
<tr>
<td id="c2" onClick="your_funct('c2');" >Text 3</td>
<td id="c2" onClick="your_funct('c2');" >Text 4</td>
</tr>
<tr>
<td id="c1" onClick="your_funct('c1');">Text 5</td>
<td id="c2" onClick="your_funct('c2');" >Text 6</td>
</tr>
</table>

Помогите найти ошибку!
Ответить с цитированием
  #2 (permalink)  
Старый 11.04.2011, 13:41
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

элемент с ИДом - уникальный

при

<button id="but"> lol </button>

<button id="but"> two </button>


document.getElementById(" but ").onclick = function() {  alert(5);  }


алерт будет только на первой кнопке
Ответить с цитированием
  #3 (permalink)  
Старый 11.04.2011, 13:46
Аватар для walik
Профессор
Отправить личное сообщение для walik Посмотреть профиль Найти все сообщения от walik
 
Регистрация: 09.11.2009
Сообщений: 1,101

Я так понимаю вам нужно при клике на ячейку закрашивать весь ряд, тогда лучше так сделать:
<html>
<head>
<script type="text/javascript" language="javascript">
function color(id) {
	var elems = document.getElementsByTagName('tr'),
	length = elems.length;
	for(i=0; i<length;i++)
		if (elems[i].id == id)
			elems[i].style.backgroundColor = 'red';
		else
			elems[i].style.backgroundColor = 'white';
}
</script>
</head>
<body>
<table border="1" width="33%"> 
<tr id="c1" onclick="color('c1');"> 
<td>Text 1</td>
<td>Text 2</td> 
</tr> 
<tr id="c2" onclick="color('c2');"> 
<td>Text 3</td>
<td>Text 4</td> 
</tr> 
<tr id="c3" onclick="color('c3');"> 
<td>Text 5</td> 
<td>Text 6</td>
</tr>
</table>
</body>
</html>
__________________
"Всегда пишите код так, будто сопровождать его будет склонный к насилию психопат, который знает, где вы живете."
Мой сертификат :-D клацай
Ответить с цитированием
  #4 (permalink)  
Старый 11.04.2011, 14:23
Профессор
Отправить личное сообщение для alexan0308 Посмотреть профиль Найти все сообщения от alexan0308
 
Регистрация: 11.04.2011
Сообщений: 207

walik, спасиб!
Чуть переделал, мне все таки нужно было красить не ряд ячеек, а определенную совокупность. Чуть переделал твой код, все работает:
<html>
<head>
<script type="text/javascript" language="javascript">
function color(id) {
var elems = document.getElementsByTagName('td'),
length = elems.length;
for(i=0; i<length;i++)
if (elems[i].id == id)
elems[i].style.backgroundColor = 'red';
else
elems[i].style.backgroundColor = 'white';
}
</script>
</head>
<body>
<table border="1" width="33%">
<tr >
<td id="c1" onclick="color('c1');">Удав</td>
<td id="c3" onclick="color('c3');" >Шмел</td>
<td id="c1" onclick="color('c1');">Гадюка</td>
<td id="c2" onclick="color('c2');" >Орел</td>
</tr>
<tr >
<td id="c2" onclick="color('c2');">Стриж</td>
<td id="c1" onclick="color('c1');" >Питон</td>
<td id="c1" onclick="color('c1');">Кобра</td>
<td id="c3" onclick="color('c3');" >Мух</td>
</tr>
<tr >
<td id="c3" onclick="color('c3');" >Ос</td>
<td id="c2" onclick="color('c2');">Соловей</td>
<td id="c2" onclick="color('c2');">Воробей</td>
<td id="c1" onclick="color('c1');" >Уж</td>
</tr>
</table>
</body>
</html>

Последний раз редактировалось alexan0308, 11.04.2011 в 14:26.
Ответить с цитированием
  #5 (permalink)  
Старый 11.04.2011, 16:07
Профессор
Отправить личное сообщение для alexan0308 Посмотреть профиль Найти все сообщения от alexan0308
 
Регистрация: 11.04.2011
Сообщений: 207

Опять проблема. Данный код прекрасно работает для приведенного примера и в опере, и в Экспловере 8. Сделал другую таблицу для своей задачи, и уже в опере работает, а в Экспловере нет! Чо такое?
Ответить с цитированием
  #6 (permalink)  
Старый 11.04.2011, 16:29
Профессор
Отправить личное сообщение для alexan0308 Посмотреть профиль Найти все сообщения от alexan0308
 
Регистрация: 11.04.2011
Сообщений: 207

А, нашел подробно анализируя...
'#328aa4' оба браузера понимают а
' #328aa4' с пробелом впереди эксплорер не понимает...
Ответить с цитированием
  #7 (permalink)  
Старый 11.04.2011, 16:34
Аватар для walik
Профессор
Отправить личное сообщение для walik Посмотреть профиль Найти все сообщения от walik
 
Регистрация: 09.11.2009
Сообщений: 1,101

alexan0308,
Сообщение от melky
элемент с ИДом - уникальный
Поэтому для вашей задачи используйте классы.
__________________
"Всегда пишите код так, будто сопровождать его будет склонный к насилию психопат, который знает, где вы живете."
Мой сертификат :-D клацай
Ответить с цитированием
  #8 (permalink)  
Старый 11.04.2011, 16:48
Профессор
Отправить личное сообщение для alexan0308 Посмотреть профиль Найти все сообщения от alexan0308
 
Регистрация: 11.04.2011
Сообщений: 207

Вот тут чувак написал

"8. Используйте «id» вместо классов, где это возможно". Конец цитаты ))

Статья
http://www.webmasters.by/articles/we...t-tips.html#p8
Ответить с цитированием
  #9 (permalink)  
Старый 11.04.2011, 17:22
Аватар для walik
Профессор
Отправить личное сообщение для walik Посмотреть профиль Найти все сообщения от walik
 
Регистрация: 09.11.2009
Сообщений: 1,101

А по спецификации он должен быть уникальным
Цитата:
This attribute assigns a name to an elemen. This name must be unique in a document.
"Этот атрибут присваивает имя элемента. Это имя должно быть уникальным в документе." Конец цитаты ))
http://www.w3.org/TR/REC-html40-9712...l.html#adef-id

И даже в той статье не использовался один ID для разных элементов, там все элементы имели разные ID, он демонстрировал что по ID обращение быстрей чем по классу
__________________
"Всегда пишите код так, будто сопровождать его будет склонный к насилию психопат, который знает, где вы живете."
Мой сертификат :-D клацай

Последний раз редактировалось walik, 11.04.2011 в 17:31.
Ответить с цитированием
  #10 (permalink)  
Старый 11.04.2011, 18:42
Профессор
Отправить личное сообщение для alexan0308 Посмотреть профиль Найти все сообщения от alexan0308
 
Регистрация: 11.04.2011
Сообщений: 207

Ну хорошо, а как мне переделать под класс?
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
onmouseout для ячейки таблицы. Sir_Hally Events/DOM/Window 2 24.01.2012 15:21
Название ячейки таблицы Questioner Общие вопросы Javascript 6 16.02.2011 08:58
Ячейки Таблицы Slawaq Элементы интерфейса 20 22.05.2010 12:49
глюк форума Gvozd Сайт Javascript.ru 11 18.03.2009 13:37
позиция рисунка внутри ячейки таблицы. arlek1n Общие вопросы Javascript 11 22.12.2008 09:21