ReSQL.ru
     
powered by simpleCommunicator - 2.0.59     © 2025 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Путь фотки, по которой кликнули
13 сообщений из 13, страница 1 из 1
Путь фотки, по которой кликнули
    #39588500
Alex_Wong
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Alex_Wong
Гость
Добрый день.
В див-контейнере лежат фотки. Не получается по клику вывести путь, по которой кликнули.
В примере, https://jsfiddle.net/2zftbxcu/
считает количество фоток не правильно, т.к. они в html лежат не слитно ...
Не получается в addEventListener указать слушать именно клик по img.
Пробовал через getElementsByTagName('img') и this в функции, - не получилось.
Покажите, пожалуйста, как правильно делать.
...
Рейтинг: 0 / 0
22.01.2018, 16:01
| Ответить | Цитировать | Написать  
Путь фотки, по которой кликнули
    #39588561
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Alex_WongПокажите, пожалуйста, как правильно делать.
Как вариант...

Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<!--
<script src='https://code.jquery.com/jquery-latest.js'></script>
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
</script>
</head>
<body>
<div id="main">
	<img src="https://javascript.ru/forum/images/smilies/smile.gif" />
	<img src="https://javascript.ru/forum/images/smilies/angry.gif" />
	<img src="https://javascript.ru/forum/images/smilies/sad.gif" />
	<img src="https://javascript.ru/forum/images/smilies/wink.gif" />
</div>
<script type='text/javascript'>
document.getElementById('main').addEventListener('click',function(e){
	if (e.target.tagName=='IMG') {
		alert(e.target.src);
	};
});
</script>
</body>
</html>
...
Рейтинг: 0 / 0
22.01.2018, 16:42
| Ответить | Цитировать | Написать  
Путь фотки, по которой кликнули
    #39588572
Alex_Wong
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Alex_Wong
Гость
krvsa,
спасибо, - работает как нужно.
...
Рейтинг: 0 / 0
22.01.2018, 16:51
| Ответить | Цитировать | Написать  
Путь фотки, по которой кликнули
    #39588601
Alex_Wong
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Alex_Wong
Гость
Если я вношу фотки в див-контейнер, например, так : https://jsfiddle.net/e8k2z567/
 

Код: html
1.
<body><div id="main"></div></body>


Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
insert_foto();
function insert_foto(){

var arr_files = ['DSC00111.JPG','DSC00112.JPG','DSC00113.JPG','DSC00114.JPG'];

  for(i=0; i<4; i++){  
      var img2 = document.createElement('img');
      img2.src = '/sss/' + arr_files[i];
      img2.alt = 'sss';
      document.getElementById('main').appendChild(img2);
  }
}
 // img2.onload = alert('yes');



можно ли считать, что они загрузятся последовательно, т.е. каждая последующая
строго после полной загрузки предыдущей? Если нет, то как правильно сделать?
Пробовал прикрутить img2.onload в setTimeout( ... , 1000) для наглядности в
одну секунду - не получилось ... Спасибо.
...
Рейтинг: 0 / 0
22.01.2018, 17:50
| Ответить | Цитировать | Написать  
Путь фотки, по которой кликнули
    #39588836
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Alex_Wongможно ли считать, что они загрузятся последовательно, т.е. каждая последующая
строго после полной загрузки предыдущей?
Нет.
Скрипт добавления выполнится мгновенно, а браузер будет пытаться грузить фотки как можно быстрее...
Alex_WongЕсли нет, то как правильно сделать?
У img есть событие onload , можно использовать его для подгрузки очередной картинки.
...
Рейтинг: 0 / 0
23.01.2018, 08:35
| Ответить | Цитировать | Написать  
Путь фотки, по которой кликнули
    #39589047
Alex_Wong
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Alex_Wong
Гость
krvsa,

Да, спасибо. Я как раз с этим .onload и застрял.
Походу понял, что были траблы из-за кэша. Думал, что прописав :
Код: html
1.
2.
<meta http-equiv="expires" content="0" />
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />


я их закрыл. Так-же к пути добавлял случайное число :
Код: javascript
1.
img2.src = '/sss/' + arr_files +'?'+ Math.floor(100000 + Math.random() * 900000);


... но где-то накосячил.
Нужна именно [i]максимально быстрая последовательная загрузка картинок.
Моё поделие с setTimeout, - понятно что не годится, его привел для наглядности :
https://jsfiddle.net/0yvg1qog/
Подскажите, пожалуйста, как правильно сделать с onload ?
...
Рейтинг: 0 / 0
23.01.2018, 13:10
| Ответить | Цитировать | Написать  
Путь фотки, по которой кликнули
    #39589052
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
вадя
Участник
Alex_Wong,
что ты хочешь этим достигнуть?
...
Рейтинг: 0 / 0
23.01.2018, 13:15
| Ответить | Цитировать | Написать  
Путь фотки, по которой кликнули
    #39589076
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Alex_Wongкак правильно сделать с onload ?
Например так...

Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
<body><div id="main"></div></body>
<script type='text/javascript'>
(function(){
	var arr_files = [
		'smile.gif',
		'angry.gif',
		'sad.gif',
		'wink.gif'
	];
	var obj=document.getElementById('main');
	function insert_foto(N){
		var img = document.createElement('img');
		img.src = 'https://javascript.ru/forum/images/smilies/' + arr_files[N];
		img.alt = 'sss'+N;
		if (N<arr_files.length-1) {
			img.onload= function(){
				insert_foto(++N);
			};
		};
		obj.appendChild(img);
	};
	insert_foto(0);
})();
</script>
...
Рейтинг: 0 / 0
23.01.2018, 13:34
| Ответить | Цитировать | Написать  
Путь фотки, по которой кликнули
    #39589114
Alex_Wong
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Alex_Wong
Гость
krvsa, круто, большое спасибо.
...
Рейтинг: 0 / 0
23.01.2018, 14:08
| Ответить | Цитировать | Написать  
Путь фотки, по которой кликнули
    #39589141
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
вадя
Участник
Alex_Wong,

так причем здесь загрузка и клик по картинке?
что в итоге надо?
...
Рейтинг: 0 / 0
23.01.2018, 14:25
| Ответить | Цитировать | Написать  
Путь фотки, по которой кликнули
    #39596875
Carhartt
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Carhartt
Гость
HTML:
Код: html
1.
2.
3.
4.
5.
6.
7.
<script src='https://code.jquery.com/jquery-latest.js'></script>
<div id="main">
<img src="/sss/DSC00111.JPG" alt="">
<img src="/sss/DSC00112.JPG" alt="">
<img src="/sss/DSC00113.JPG" alt="">
<img src="/sss/DSC00114.JPG" alt="">
</div>



JS:
Код: javascript
1.
2.
3.
4.
5.
$(document).ready(function() {
	$("img").click(function() {
  	alert($(this).attr('src'));
  });
});
...
Рейтинг: 0 / 0
05.02.2018, 16:02
| Ответить | Цитировать | Написать  
Путь фотки, по которой кликнули
    #39598546
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
Carhartt,

Как вариант:
Код: javascript
1.
for(var i=0;i<document.images.length;i++) alert(document.images[i].src);
...
Рейтинг: 0 / 0
07.02.2018, 19:52
| Ответить | Цитировать | Написать  
Путь фотки, по которой кликнули
    #39598549
ShSerge
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
ShSerge
Участник
пардон. Про клик забыл. ;)
...
Рейтинг: 0 / 0
07.02.2018, 19:55
| Ответить | Цитировать | Написать  
13 сообщений из 13, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Путь фотки, по которой кликнули
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение
NoSQL.ru       Новости, Чат       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&fpage=30&tid=1444302]:
 0ms
get settings:
 7ms
get forum list:
 12ms
check forum access:
 4ms
check topic access:
 4ms
track hit:
 56ms
get topic data:
 13ms
get forum data:
 3ms
get page messages:
 46ms
get tp. blocked users:
 2ms
others: 11ms
total:  158ms
созд. / загр.: 158ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]