Как вызывать модальное окно для нескольких кнопок?

Question

[lemonlimelike]

Всем привет! Использую делегирование событий. И значит при клике на какой-то div'block нужно вызывать модальное окно. Таких div'block несколько, соответственно модальных окон тоже будет несколько. НО, можно ли сделать одно модальное окно и в него просто подставлять нужные данные? Типа, написать функцию, которая будет принимать пару параметров, и возвращать html код, который нужен для отображения модального окна. Такой подход будет правильным?

Answer 1

[Николай Чуприк]

Да, такой подход будет правильным. А лучше изучите веб-компоненты.

Answer 2

[Антон Усачев]

Да.
Например, сделать окно общего стиля, а внутрь напихать блоков с disaplay: none.
На div-trigger вешать атрибут типа data-pop="pop-01", "pop-02" и т.д., и давать блокам класс pop-01, pop-02...
Соответственно в скрипте писать примерно так:

$('[data-pop]').click(function() {
	var popName = $(this).attr('data-pop'); // или $(this).data('pop')

	$('.pop-' + popName).addClass('active') // что подразумевает в цсс-файле .data-pop.active {display: block}
});

Остальным блокам убирать класс active.
Это один из подходов. Может, вы прям из базы тягяете контент или аяксом, тогда все еще проще: подтягиваем контент и показываем поп-ап.