Как вернуть значение из цикла each?

Question

[Vlad_beg]

Имеется несколько дивов с классом .image-portfolio у каждого класса есть data-section с определенным значением и нужно опеределить, по какому значению была нажата кнопка, и вернуть это значение из функции. Не удается получить.

$(".image-portfolio").click(function(){
		$(this).each(function(){
			var sect = $(this).attr("data-section");
    window.location = "portfolio.html";
		});
	});
	alert(sect);

Comments

[Сергей delphinpro]

в this уже текущий элемент

$(".image-portfolio").click(function(){
  var sect = $(this).attr("data-section");
  alert(sect);
});

[Vlad_beg]

Сергей: но вне функции у меня алерт не работает у меня еще имеется редирект на другую страницу после var sect = $(this).attr("data-section");

[Сергей delphinpro]

Vlad_beg:
конструкция $(".image-portfolio").click(function(){ ... }); Всего лишь навешивает обработчик клика на элемент. Навесили и пошли дальше. Этот обработчик не выполняется сразу. Он выполнится только тогда, когда по элементу жмякнут мышкой. В вашем коде навесили обработчик и сразу вызываем алерт. Ясен пень алерт ничего не покажет. Я вам показал как оно работает - навесили обработчик и ждем когда он сработает. Когда он сработал - выполняем нужные действия. В данном случае алерт.

[Vlad_beg]

Спасибо за развернутый ответ

Answer 1

[Сергей Соколов]

Т.к. кликнут ещё неизвестно, когда, а код срабатывает сразу при загрузке страницы, не обойтись без асинхронности и отлова событий. По клику сработает одна функция, которая получит значение data-атрибута кликнутого элемента. И, чтобы усложнить всё, запустит ещё одно событие – на этот раз глобального объекта window, который «видно» из любого участка кода. И уже событие на window можно слушать где угодно, и получить значение из data кликнутого элемента.

$(".image-portfolio").on( 'click', function(){
	window.dispatchEvent(
		new CustomEvent( 'sect', { detail: $(this).data("section")} )
	);
});

// где-то далеко далеко ловим данные из события
window.addEventListener('sect', function(e) {
	$('body').append('<div>кликнули на ' + e.detail + '</div>');
});

попробовать

На деле достаточно правильно распорядиться полученным значением сразу в первой части кода. Просто захотелось вспомнить, как «бросать» собственные события.

Answer 2

[Александр Мельниченко]

$(".image-portfolio").click(function(){
      var sect = $(this).data("section");
      alert(sect);
  });

Comments

[Vlad_beg]

мне нужно вернуть значение из функции