Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 07.04.2011, 00:48
Аспирант
Отправить личное сообщение для trololo Посмотреть профиль Найти все сообщения от trololo
 
Регистрация: 07.04.2011
Сообщений: 46

onclick. смена изображения
пытаюсь сделать такую штуку: есть на странице блок в котором расположены маленькие картинки (рисунки столов ресторана) по нажатии на которую картинка меняется на такуюже по форме но другого цвета.
<div id="order" >
<img id="1" src="/images/order/restaurant/1.gif" onclick="ch(this.id)">
<img id="2" src="/images/order/restaurant/2.gif" onclick="ch(this.id)">
...
</div>

function ch(id)
{
document.getElementById(id).src="/images/order/restaurant/"+id+"_1.gif";
//и другие действия
}

туплю вот в чем. нужно чтобы была выделена только одна картинка. а если нажать на первую а потом на вторую то они обе выделены что мне не нужно. есть мысли на счет того чтобы сделать некую переменную которая будет отвечать за предыдущее фото. но вот как это реализовать не пойму..

предполагаю что както так. но переменная то перезаписывается.
var parent=null;
function ch(id)
{
document.getElementById(id).src="/images/order/restaurant/"+id+"_1.gif";
//и другие действия
if(parent!=null)
{
document.getElementById(parent).src="/images/order/restaurant/"+parent+".gif";
}
else
parent=id;
}

простите если ответ на вопрос столь очевиден или уже где то есть. js учу не так давно.
Ответить с цитированием
  #2 (permalink)  
Старый 07.04.2011, 01:19
Аватар для poorking
prodigy
Отправить личное сообщение для poorking Посмотреть профиль Найти все сообщения от poorking
 
Регистрация: 01.11.2010
Сообщений: 503

document.getElementById("order").onclick = function(e){
		var img = function(event){
			return event.target || event.srcElement;
		}(e || window.event)
		
		//Если кликнули не по картинке а по родителю всех картинок
		if(img === this){
			return false;
		}
		
		var prev = arguments.callee.prev;
		//то есть если это не первый клик
		if(prev){
			//картинка по которой кликнули до этого клика
			prev.src = //тут как то преобразуете путь чтобы картинка стала обычная на пред.картинке
		}
		//сохраняем для след. вызова ссылку на эту картинку
		arguments.callee.prev = img;
		
		img.src = //делаете тут картинку "такую же но другого цвета"
		
	}


Что то наподобие этого, не тестил, ошибки не проверял, но суть, что создаем статическое свойство у функции обработчика и в нем храним пред. картинку. Можно просто создать переменную, глобальную по отношению к этой функции. И картинку ловим по клику на контейнере всех картинок
__________________
readOnly
Ответить с цитированием
  #3 (permalink)  
Старый 07.04.2011, 14:04
Аспирант
Отправить личное сообщение для trololo Посмотреть профиль Найти все сообщения от trololo
 
Регистрация: 07.04.2011
Сообщений: 46

poorking, спасибо, подтолкнули на мысль.
Ответить с цитированием
  #4 (permalink)  
Старый 07.04.2011, 15:39
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,124

trololo
var parent=null;
function ch(id)
{
if(parent!=id)
{
document.getElementById(id).src="/images/order/restaurant/"+id+"_1.gif";
if(parent)document.getElementById(parent).src="/images/order/restaurant/"+parent+".gif";
parent=id;
}
}
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как избавиться от каскадного onclick? GydruS Events/DOM/Window 2 24.02.2011 11:54
Смена изображения MaxB Events/DOM/Window 7 10.02.2010 22:01
отрисовка изображения по произвольным координатам Th0m@$ Events/DOM/Window 14 23.01.2010 16:04
Событие onClick avtor01 Events/DOM/Window 3 03.09.2009 18:01
смена изображения кнопками slonik_mak Я не знаю javascript 2 04.06.2009 11:48