Хочу понять, где ошибка
Добрый день!
На одном из форумов я воззвал: Как сделать, чтобы при клике на одной картинке появлялась другая, и при клике же на ней снова возвращалась первая, - и всё это в рамках <img src ....... /> без (очень желательно, т.к. картинок этих очень много на странице, их ещё надо preload'ить, и при использовании отдельного скрипта вес страницы почти бы удваивался) подключения дополнительного скрипта. Мне ответили: <img src="http://ya.ru/logo.png" onclick="this.src=(this.src=='http://ya.ru/logo.png')?'http://www.google.md/intl/en_com/images/logo_plain.png':'http://ya.ru/logo.png'" /> Я попробовал этот пример и запрыгал от радости, но стоило мне подставить свои данные: <img src="1.jpg" onclick="this.src=(this.src=='1.jpg')?'2.jpg':'1.j pg'" /> и ничего ровным счётом не произошло. очень хотелось бы разобраться. |
Цитата:
И с дополнительным скриптом места будет меньше занимать. |
Т.е. на локальной машине это невозможно, или надо писать что-то вроде С/../../../1.jpg?
|
Сделайте alert(this.src)
|
Спасибо, но ??? это как?
Если не трудно - не готовый код прошу, а хочу сам понять, что и как надо сделать. Пару слов по сути. |
<img src="1.jpg" onclick="alert(this.src)" /> |
Здравствуйте!
Судя по вашему сообщению, вы ну совсем не знаете javascript. Освойте основы языка и вопрос отпадет сам, полностью или частично. А с чем не справитесь - поможем. На сайте javascript можно начать изучать с учебника, раздел Основы javascript. Возможно, вам также понадобится HTML - учебник есть, например, здесь: http://ru.html.net/tutorials/html/ Задавайте конкретные вопросы по ходу дела. |
Да, js что-то не даётся; во всех книгах пока вижу одну большую фигу... Я ведь не первый день ломаю голову над этим вопросом, и листаю, и гуглю, но не нашел ответа - хотя бы на эти вопросы (вернусь к примеру):
<img src="http://ya.ru/logo.png" onclick="this.src=(this.src=='http://ya.ru/logo.png')?'http://www.google.md/intl/en_com/images/logo_plain.png':'http://ya.ru/logo.png'" /> чем = отличается от == что делает знак вопроса ')?' и чем же, черт побери, относительный путь для js отличается от абсолютного |
абсолютный путь это путь с указанием всех папок, а относительный относительно файла с кодом.
= знак присваивания. Например i=5. Теперь переменной i присвоили 5. А == - равенство. 2*2==3? Бред! любой первоклашка знает что 2*2==5; То есть знак == в программировании как знак = в алгебре. http://javascript.ru/book/definitiveguide лучшая книга |
Цитата:
Цитата:
== - сравнение с приведением ? знак логического условия подобно if (x) за относительный и абсолютный путь уже сказали. |
Я знаю html и css - надеюсь, на -4; сталкиваясь по ходу дела с js поднатыркался количественно настраивать скрипты под свои нужды, но вот суть, "душу" языка никак не могу ухватить; может у меня совершенно апрограммистские мозги.Теперь по сути:
html-файл с <img src="1.jpg" onclick="this.src=(this.src=='1.jpg')?'2.jpg':'1.j pg'" /> лежит у меня на локальной машине в одной папке с jpgами - как тут прописать абсолютный путь? Я так понимаю задачу: <img src="1.jpg" onclick="this.src='2.jpg'" onclick="вот как сюда впихнуть отмену предыдущего (onclick="this.src='2.jpg'") события и возврат к отображению исходного 1.jpg" />??? |
<img src="1.jpg" onclick="this.src=(/\/1\.jpg$/i.test(this.src))?'2.jpg':'1.jpg'" /> |
Спасибо огромное, PeaceCoder, работает! (Профессор - он и есть профессор!)
А можно попросить объяснить происходящее? Посимвольно, если не трудно. |
я заменил проверку пути на регулярное выражение
/\/1\.jpg$/i, которое просто проверяет тоже this.src=='1.jpg', только что бы оно было не точно равно, а необходимое содержалось в конце пути, т.к. он будет чтото типа http://ваш.домен/путь/к/странице/1.jpg, выделенную часть я и проверял |
Что-то забрезжило: собака покоилась в правильном указании пути. Общение с компетентными людьми продвигает быстрее, чем чтение самых удачных книг, - лишь бы это было не в тягость этим самым компетентным людям.
Это я к тому, что что в варианте, который надо было усовершенствовать (согласитесь, мелькание, связанное с onmouseover-onmouseout может раздражать пользователя, ибо действие это ему малоподконтрольно - всё происходит как бы само собой, ибо просто движение мышью чисто психологически не воспринимается за элемент управления), так вот, - в варианте <img src="1.jpg" onmouseover="this.src='2.jpg'" onmouseout="this.src='1.jpg'" /> было ещё весьма необходимое дополнение: <h4 id="one">A</h4> <img src="1.jpg" onmouseover="this.src='2.jpg'; document.getElementById('one').innerHTML='B" onmouseout="this.src='1.jpg';document.getElementBy Id('one').innerHTML='A'" /> Можно ли "прикрутить" этот document.getElementById('one').innerHTML='..." к варианту <img src="1.jpg" onclick="this.src=(/\/1\.jpg$/i.test(this.src))?'2.jpg':'1.jpg'" /> P.S. Кстати, а что дают slashs /\? Я их для интереса убрал, а всё равно всё работает |
Цитата:
А на счет прикрутить не получится. т.к. смена у тебя идет на 2 разных действия мыши, и соединить в одно к сожалению, не выйдет. |
А вот ещё похожий и тоже рабочий пример:
<img src="1.jpg" onclick="this.src=(this.src.match(/1\.jpg$/))? 2.jpg':'1.jpg';" /> т.е. я так понимаю - один и тот же результат в js можно получать различным путями. А что даёт двоеточие в конце записи - между '2.jpg':'1.jpg' ? |
Выше я описал что такое знак ? и дал ссылку. прочтите и все поймете.
|
Мысли вслух:
Как то некошерно такую кодинку запихивать в теги вообще то .:-? |
micscr,
:D |
Часовой пояс GMT +3, время: 09:49. |