Разный текст в модальных окнах
Всем привет (и с наступающим)!
Такой вопрос: есть несколько элементов разбросанных по странице вида: <span class="popup" id="type1">Кнопка</span> <div class="popup" id="type2">Еще кнопка</div> <button class="popup" id="type3">Тоже элемент</button> <div class="modal"> <div class="first">first block</div> <div class="second">second block</div> <div class="third">third block</div> </div> По кликам на любой из этих элементов открывается модальное окошко.
var popup = document.querySelectorAll('.popup'),
modal = document.querySelector('.modal'),
modalBtn = document.getElementById('btn-send'),
modalClose = document.querySelector('.modal-close');
for(i=0; i<popup.length; i++) {
popup[i].addEventListener("click", function() {
modal.classList.add('active');
});
};
modalClose.addEventListener("click", function() {
modal.classList.remove('active');
});
Вопрос в следующем: как отследить какой был id у кликнутого элемента .popup, чтобы исходя из этого заменить содержимое некоторых тегов внутри модального окна, к примеру через innerHTML с <div class="first">first block</div> на <div class="first">new text</div> Надеюсь не слишком путано изложил:-? Гран мерси заранее всем добрым людям.:thanks: |
renton88,
document.addEventListener("DOMContentLoaded", function() {
var popup = document.querySelectorAll(".popup"),
modal = document.querySelector(".modal"),
modalBtn = document.getElementById("btn-send"),
modalClose = document.querySelector(".modal-close");
[].forEach.call(popup, function(node, i) {
node.addEventListener("click", function() {
var html = "first block";
if (i == 1) html = "new text";
document.querySelector(".first").innerHTML = html;
modal.classList.add("active")
})
});
modalClose.addEventListener("click", function() {
modal.classList.remove("active")
})
});
|
renton88,
document.addEventListener("DOMContentLoaded", function() {
var popup = document.querySelectorAll(".popup"),
modal = document.querySelector(".modal"),
modalBtn = document.getElementById("btn-send"),
modalClose = document.querySelector(".modal-close");
[].forEach.call(popup, function(node, i) {
node.addEventListener("click", function() {
var html = "first block";
if (node.id == "type2") html = "new text";
document.querySelector(".first").innerHTML = html;
modal.classList.add("active")
})
});
modalClose.addEventListener("click", function() {
modal.classList.remove("active")
})
});
|
| Часовой пояс GMT +3, время: 04:53. |