Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: Общие вопросы > Задание стиля CSS ячейке таблицы

Автор: Debate 19.8.2005, 01:18

Перейду сразу к вопросу, у меня на сайте есть таблица скажем :

Код


<table>
<tr id="hz_1">
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr id="hz_2">
<td>1</td>
<td><input type="text" id="d1" value="hz_2">2</td>
<td>3</td>
</tr>
</table>

и как мне сделать так, чтоб у определенного td с его идом фон менялся ? вот мой Javascript:

Код


function light()
{
    d = document.getElementById("d1") ; // это поле которе нам известно
    if(d.value != "")
    {
          h = document.getElementById(""+d.value+"");  // вызываем элемент со значением полученным из поля
          h.className = "test";
    }
}

Вроде все прально написано... проверял тем, что ненужые поля убирал а нужное выводил и все подсвечивалось .. а когда вывел все , то ничего не подсвечивается ( кто нить может помочь ?

Автор: Aliance 19.8.2005, 02:27

Во-первых, не понятна на каком событии все должно происходить?
Во-вторых, зачем писать так:

Цитата

document.getElementById(""+d.value+"");

можно и так:

Код


document.getElementById(d.value);

В третьих, вдимо вводишь неправельное что-то в интуп, т.е. id которого не существует. Браузер ругается, мол, не существует объект?

Автор: Bangladesh 19.8.2005, 07:34

Код


<table>
<tr>
<td id="1td" width=100 style="background-color: #333333;" onMouseOver="tdDown();" onMouseOut="tdReturn();">1</td>
<td id="2td" width=100 style="background-color: #666666;" onMouseOver="tdDown();" onMouseOut="tdReturn();">2</td>
</tr>
</table>

этот вариант если используешь разные бакгроунды для каждого td. и разный цвет, для смены. если у тебя всё одинаково, то вместо массивов используй две переменные.

Код


<script language="JavaScript">
var oldclr = new Array(); // Обычный цвет фона (можно автоматически создавать)
oldclr[1] = "#333333";
oldclr[2] = "#666666";
var tdclr = new Array(); // Цвет фона на который нужно менять
tdclr[1] = "#5CFF40";
tdclr[2] = "#6640FF";

function tdDown(){ 
var obj = window.event.srcElement;
var objID = obj.id;
var objID = getNumOfTdId(objID); // Получение только цифры из id. В id допустимо исп. только одной цифры.
obj.style.background = tdclr[objID];
}
function tdReturn(){
var obj = window.event.srcElement;
var objID = obj.id;
var objID = getNumOfTdId(objID);
obj.style.background = oldclr[objID];
}
function getNumOfTdId(id){ // Вырезание числа
id = id.charAt(0);
id = eval(id);
return id;
}
</script>

если не хочешь использовать id типа 1,2,3,4 то воспользуйся charAt();

М	Пользуемся подсветкой правельно. JS подсветка не понимает тегов