Javascript.RU

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

Как извлечь адрес картинки, указанный внутри функции onclick?
Добрый день!
Есть маленькая картинка, при клике по которой появляется большая:
<img class="highslide" onclick="try {hs.expand(this,{src:'/images/big_pic.jpg'});}catch(e){}" src="/images/small_pic.jpg" width="200" height="150" alt="picture" border="0" />

Я хочу переделать html под галерею fancybox следующим образом:
<a rel="group1" href="/images/big_pic.jpg" class="fancybox">
  <img src="/images/small_pic.jpg" alt="picture" border="0" height="150" width="200" />
</a>

Поскольку страниц, где нужно внести изменения, очень много, хочу сделать это с помощью скрипта. Я полагаю, что для этого мне нужно получить адрес большой картинки (строку '/images/big_pic.jpg'), чтобы затем подставить его в атрибут href другой ссылки, которая позже обернет картинку.
Подскажите, пожалуйста, как извлечь адрес большой картинки методами js/jquery? Как на него указать?
Ответить с цитированием
  #2 (permalink)  
Старый 03.02.2013, 14:41
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

А в каком окружени вы собрались вносить изменения? NodeJS? В браузер то файлы особо не подгрузишь и тем более не сохранишь.
Ответить с цитированием
  #3 (permalink)  
Старый 03.02.2013, 15:16
Новичок на форуме
Отправить личное сообщение для sidarvik Посмотреть профиль Найти все сообщения от sidarvik
 
Регистрация: 03.02.2013
Сообщений: 7

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

Я пока только еще изучаю js и jquery, поэтому не уверена, правильная ли логика, но мне кажется, скрипт должен быть примерно таким:

var bigImgLink = $('???????'); /* вот тут у меня и возникли затруднения...*/
$('img.highslide').each(function(){
    $(this).removeAttr("onclick").removeClass().wrap("<a rel='group1' class='fancybox'></a>").attr("href", bigImgLink)
});

Последний раз редактировалось sidarvik, 03.02.2013 в 15:21.
Ответить с цитированием
  #4 (permalink)  
Старый 03.02.2013, 15:25
Новичок на форуме
Отправить личное сообщение для sidarvik Посмотреть профиль Найти все сообщения от sidarvik
 
Регистрация: 03.02.2013
Сообщений: 7

Т.е. в идеале значение переменной bigImgLink должно быть равно строке /images/big_pic.jpg, и это значение потом подставляется в href=""
Ответить с цитированием
  #5 (permalink)  
Старый 03.02.2013, 15:31
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Проще сделать закос под highslide ))

hs = {
    expand: function(element, options) {
        $.fancybox.open({href: options.src});
    }
};


только не помню - .open() или .show(). Но в целом идею думаю поняли. Если не заработает - F12 || Ctrl+Shift+I в помощь. Правда хреново что вызов заключен в try-catch - все ошибки заглушит.
Ответить с цитированием
  #6 (permalink)  
Старый 03.02.2013, 15:33
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

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

Теперь ясно что вы просто хотите поставить костыль чтоб все работало со старым кодом
Ответить с цитированием
  #7 (permalink)  
Старый 03.02.2013, 15:53
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

sidarvik,
напишите ещё парочку примеров с
<img class="highslide" onclick="try {hs.expand(this,{src:'/images/big_pic.jpg'});}catch(e){}" src="/images/small_pic.jpg" width="200" height="150" alt="picture" border="0" />

меня интересует всегдали images/big_pic.jpg или есть другие указатели
Ответить с цитированием
  #8 (permalink)  
Старый 03.02.2013, 16:05
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

рони, какой смысл шуршать DOM'ом когда можно просто подстроиться под старый код?
Ответить с цитированием
  #9 (permalink)  
Старый 03.02.2013, 16:28
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

Сообщение от danik.js
рони, какой смысл шуршать DOM'ом когда можно просто подстроиться под старый код?
я не в теме того что вы предложили.
Ответить с цитированием
  #10 (permalink)  
Старый 03.02.2013, 16:29
Новичок на форуме
Отправить личное сообщение для sidarvik Посмотреть профиль Найти все сообщения от sidarvik
 
Регистрация: 03.02.2013
Сообщений: 7

Вообще images/big_pic.jpg - это условный пример был)
Вот реальный html со страницы:

<p class="fotoline"><img class="highslide" onclick="try{hs.expand(this,{src:'/d/163953/d/hurgada-.jpg'});}catch(e){}" src="/d/163953/d/180489406_5.jpg" width="180" height="120" alt="Хургада " border="0" /><img class="highslide" onclick="try{hs.expand(this,{src:'/d/163953/d/3170138978_07448bfbdf_o.jpg'});}catch(e){}" src="/d/163953/d/180488006_5.jpg" width="180" height="135" alt="3170138978_07448bfbdf_o" border="0" /><img class="highslide" onclick="try{hs.expand(this,{src:'/d/163953/d/egipet_1600.jpg'});}catch(e){}" src="/d/163953/d/109448406_5.jpg" width="180" height="135" alt="egipet_1600" border="0" /><img class="highslide" onclick="try{hs.expand(this,{src:'/d/163953/d/180489006_7.jpg'});}catch(e){}" src="/d/163953/d/180489006_5.jpg" width="180" height="135" alt="4064" border="0" /><img class="highslide" onclick="try{hs.expand(this,{src:'/d/163953/d/81.jpg'});}catch(e){}" src="/d/163953/d/109447006_5.jpg" width="180" height="135" alt="81" border="0" /></p>
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как проиндексировать картинки HTML код которых генерируется на JS greatilya Оффтопик 9 22.09.2010 07:42
скрол мышкой картинки внутри слоя snk Элементы интерфейса 7 07.09.2010 18:22
Как сделать просмотр большой картинки? greatilya Элементы интерфейса 7 20.05.2010 13:44
Как изменить размер картинки? Mihail Общие вопросы Javascript 1 25.10.2009 13:42
Как "переключать" картинки в меню навигации? KirTer Элементы интерфейса 1 22.06.2009 11:49