Javascript.RU

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

делаю конструктор из DIV. Замена фона. проблемы.
Только-только учусь...

Делаю форму - конструктор на сайте, событие onclick выдает ошибку:
Uncaught SyntaxError: Unexpected identifier test.php:62
Uncaught ReferenceError: jsneck is not defined test.php:63

соответственно строки:
<li onclick="finddiv(); javascript: document.getElementById('jsneck').style.background Image=='url(http://192.168.1.150/web/body0.png)'; "> Open Neck </li>
<li onclick="javascript: document.getElementById('constr_neck').style.backg round Image='url(http://192.168.1.150/web/body1.png)';"> Квадрат </li>

------------

на 61-ой строке вроде как присваиваю значение jsneck, но все-равно неработает.

Кому не очень трудно, гляньте пожалуйста что не так делаю.

Код:
<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>Меню</title>
  <style>
.main {width: 950px; height:100%; border: 0px; margin: 0px; padding: 0px}  
  
.constr_main {width:245px; height:474px; border: 0px; margin: 0px; padding: 0px}

.constr_background {width:244px; height:474px; border: 0px; margin: 0px; padding: 0px; background-image: url(http://192.168.1.150/web/dp.jpg)}
  
.constr_head {width:245px; height:70px; background-image: url(http://192.168.1.150/web/head.jpg);}

.constr_neck {width:245px; height:138px; background-image: url(http://192.168.1.150/web/body0.png);}

.constr_arms {width:245px; height: 202px; margin-top: -138px; background-image: url(http://192.168.1.150/web/arms1.png);}

.constr_legs {width:245px; height:266px; margin-top: -64px; background-image: url(http://192.168.1.150/web/leg1.png);}  
  
  
  
.choose {width:685px; height: 200px;margin-top: -400px; margin-left: 250px;}

.choose_neck {width:150px; height:200px;}
.choose_arms {width:150px; height:200px;}
.choose_legs {width:150px; height:200px;}
.floatleft {float: left;}

  </style>
 </head>
 <script type="text/javascript" language="javascript">
function finddiv() 	
    	{ 	
	// ищем нужный нам тег информера
			var jsneck = document.getElementsByClassName("constr_neck");
			var jsarms = document.getElementsByClassName("constr_arms");
			var jslegs = document.getElementsByClassName("constr_legs");
		}
</script> 
 <body>
 
<div class="main">
<div class="constr_main floatleft">
	<div class="constr_background">
		<div class="constr_head">		
		</div>
		<div class="constr_neck">		
		</div>
		<div class="constr_arms">		
		</div>
		<div class="constr_legs">		
		</div>
	</div>
 </div>
 
 <div class="choose floatleft">
	<div class="choose_neck floatleft">
	Choose Neck:
		<ul>
		<li onclick="finddiv(); javascript: document.getElementById('jsneck').style.background Image=='url(http://192.168.1.150/web/body0.png)'; "> Open Neck </li>
		<li onclick="javascript: document.getElementById('constr_neck').style.background Image='url(http://192.168.1.150/web/body1.png)';"> Квадрат </li>
		<li onclick="javascript: jsneck.style.backgroundImage='url(http://192.168.1.150/web/body2.png)';"> Треугольник </li>
		<li onclick="javascript: jsneck.style.backgroundImage='url(http://192.168.1.150/web/body3.png)';"> Полукруг </li>
		</ul>
	</div>
</div>
</div> 

</body>
Ответить с цитированием
  #2 (permalink)  
Старый 30.07.2012, 09:19
Аватар для vadim5june
Студент
Отправить личное сообщение для vadim5june Посмотреть профиль Найти все сообщения от vadim5june
 
Регистрация: 30.04.2012
Сообщений: 1,113

вместо
<li onclick="finddiv(); javascript: document.getElementById('jsneck').style.background Image=='url(http://192.168.1.150/web/body0.png)'; "> Open Neck </li>

нужно
<li onclick="finddiv(); document.getElementById('jsneck').style.backgroundImage='url(http://192.168.1.150/web/body0.png)'; "> Open Neck </li>

Последний раз редактировалось vadim5june, 30.07.2012 в 10:48.
Ответить с цитированием
  #3 (permalink)  
Старый 30.07.2012, 09:26
Профессор
Отправить личное сообщение для Dmitriyff Посмотреть профиль Найти все сообщения от Dmitriyff
 
Регистрация: 22.07.2012
Сообщений: 164

переменные оппределяются в функции, и уничтожаются после выхода из нее,
вот почитать

при клике по OpenNeck ошибка у вас нету элемента с id jsneck
при клике по Квадрат у вас нету элемента с id constr_neck
Ответить с цитированием
  #4 (permalink)  
Старый 30.07.2012, 09:27
Профессор
Отправить личное сообщение для Dmitriyff Посмотреть профиль Найти все сообщения от Dmitriyff
 
Регистрация: 22.07.2012
Сообщений: 164

Ну и да javascript: не нужен
Ответить с цитированием
  #5 (permalink)  
Старый 30.07.2012, 10:39
Аватар для bes
bes bes вне форума
Профессор
Отправить личное сообщение для bes Посмотреть профиль Найти все сообщения от bes
 
Регистрация: 22.03.2012
Сообщений: 3,744

Сообщение от Dmitriyff
при клике по Квадрат у вас нету элемента с id constr_neck
этот есть, может дело в этом background Image (пробел)

Сообщение от Dmitriyff
переменные оппределяются в функции, и уничтожаются после выхода из нее,
есть ещё замыкания
Ответить с цитированием
  #6 (permalink)  
Старый 30.07.2012, 17:57
Профессор
Отправить личное сообщение для Dmitriyff Посмотреть профиль Найти все сообщения от Dmitriyff
 
Регистрация: 22.07.2012
Сообщений: 164

Сообщение от bes
этот есть, может дело в этом background Image (пробел)
Ну в этом тоже проблема, но где вы увидили элемент с id constr_neck??? три раза искал, покажите пожалуйста

Сообщение от bes
есть ещё замыкания
вы их тут видите? или меня поучаете?
Ответить с цитированием
  #7 (permalink)  
Старый 30.07.2012, 18:19
Аватар для bes
bes bes вне форума
Профессор
Отправить личное сообщение для bes Посмотреть профиль Найти все сообщения от bes
 
Регистрация: 22.03.2012
Сообщений: 3,744

Сообщение от Dmitriyff
Ну в этом тоже проблема, но где вы увидили элемент с id constr_neck??? три раза искал, покажите пожалуйста
48 строчка
<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>Меню</title>
  <style>
.main {width: 950px; height:100%; border: 0px; margin: 0px; padding: 0px}  
  
.constr_main {width:245px; height:474px; border: 0px; margin: 0px; padding: 0px}

.constr_background {width:244px; height:474px; border: 0px; margin: 0px; padding: 0px; background-image: url(http://192.168.1.150/web/dp.jpg)}
  
.constr_head {width:245px; height:70px; background-image: url(http://192.168.1.150/web/head.jpg);}

.constr_neck {width:245px; height:138px; background-image: url(http://192.168.1.150/web/body0.png);}

.constr_arms {width:245px; height: 202px; margin-top: -138px; background-image: url(http://192.168.1.150/web/arms1.png);}

.constr_legs {width:245px; height:266px; margin-top: -64px; background-image: url(http://192.168.1.150/web/leg1.png);}  
  
  
  
.choose {width:685px; height: 200px;margin-top: -400px; margin-left: 250px;}

.choose_neck {width:150px; height:200px;}
.choose_arms {width:150px; height:200px;}
.choose_legs {width:150px; height:200px;}
.floatleft {float: left;}

  </style>
 </head>
 <script type="text/javascript" language="javascript">
function finddiv() 	
    	{ 	
	// ищем нужный нам тег информера
			var jsneck = document.getElementsByClassName("constr_neck");
			var jsarms = document.getElementsByClassName("constr_arms");
			var jslegs = document.getElementsByClassName("constr_legs");
		}
</script> 
 <body>
 
<div class="main">
<div class="constr_main floatleft">
	<div class="constr_background">
		<div class="constr_head">		
		</div>
		<div class="constr_neck">		
		</div>
		<div class="constr_arms">		
		</div>
		<div class="constr_legs">		
		</div>
	</div>
 </div>
 
 <div class="choose floatleft">
	<div class="choose_neck floatleft">
	Choose Neck:
		<ul>
		<li onclick="finddiv(); javascript: document.getElementById('jsneck').style.background Image=='url(http://192.168.1.150/web/body0.png)'; "> Open Neck </li>
		<li onclick="javascript: document.getElementById('constr_neck').style.background Image='url(http://192.168.1.150/web/body1.png)';"> Квадрат </li>
		<li onclick="javascript: jsneck.style.backgroundImage='url(http://192.168.1.150/web/body2.png)';"> Треугольник </li>
		<li onclick="javascript: jsneck.style.backgroundImage='url(http://192.168.1.150/web/body3.png)';"> Полукруг </li>
		</ul>
	</div>
</div>
</div> 

</body>

Хотя пардон, ваша правда

Сообщение от Dmitriyff
вы их тут видите? или меня поучаете?
фраза звучала как абсолютная истина, поэтому уточнил (если об этом знали, не воспринимайте на свой счёт, если не знали - воспринимайте )

Последний раз редактировалось bes, 30.07.2012 в 18:21.
Ответить с цитированием
  #8 (permalink)  
Старый 30.07.2012, 18:32
Профессор
Отправить личное сообщение для Dmitriyff Посмотреть профиль Найти все сообщения от Dmitriyff
 
Регистрация: 22.07.2012
Сообщений: 164

Приятно иметь с вами дело =-)
Ответить с цитированием
  #9 (permalink)  
Старый 01.08.2012, 11:40
Аватар для wmag
Аспирант
Отправить личное сообщение для wmag Посмотреть профиль Найти все сообщения от wmag
 
Регистрация: 06.02.2012
Сообщений: 50

Посольку я только осваиваюсь в JAvaScript програмировании, мои вопросы могут звучать абсолютно идиотскими, ноя стараюсь формулировать свои вопросы исходя из того как я вижу язык. (хотя исходя из того, что я только учусь - вижу я его не очень четко)

Начал Использовать CHROME для отладки и проверки команд.

Dmitriyff, спасисбо за замечание про кничтожение переменных по окончании функции - учту.

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

vadim5june, вы писали:
<li onclick="finddiv(); document.getElementById('jsneck').style.background Image='url(http://192.168.1.150/web/body0.png)'; "> Open Neck </li>

Спасибо, работает.

Стало быть работать с элементами, по getElementsByClassName - нельзя?

а если мне надо будет одним кликом изменить все элементы определнного Класса?

Последний раз редактировалось wmag, 01.08.2012 в 16:27.
Ответить с цитированием
  #10 (permalink)  
Старый 01.08.2012, 12:07
Аватар для vadim5june
Студент
Отправить личное сообщение для vadim5june Посмотреть профиль Найти все сообщения от vadim5june
 
Регистрация: 30.04.2012
Сообщений: 1,113

Сообщение от wmag
Стало быть работать с элементами, по getElementsByClassName - нельзя?
Если без Jquery работать то всегда проблемы с кроссбраузерность возникнут-нужно писать функции для браузеров которые не поддерживают
есть еще querySelector и querySelectorAll
http://javascript.ru/blog/subzey/que...orAll-praktike
более мощные-там и по классу можно выборку сделать
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
изменение позиции фона одного div пока мышь находится на ссылке desir Javascript под браузер 3 05.02.2012 22:54
Проблемы с созданием div в Опера eternal Events/DOM/Window 3 05.05.2011 20:09
смена фона div booodyk Общие вопросы Javascript 9 28.04.2010 13:55
Замена CSS класса каждого четвертого div iGusse jQuery 4 17.12.2009 23:51
глюк форума Gvozd Сайт Javascript.ru 11 18.03.2009 14:37