#javascript #jquery #foreach #event-delegation
Вопрос:
Я пытаюсь изменить цвет фона динамических html-элементов ( span
), когда пользователь нажимает на них.
function showQuestion(){
for(let i = 0; i < QuesPartA.length; i ){
$(".questionBox").append('<div class="Question">Number ' parseInt(i 1) '</div>');
QuesPartA[i]['option'].forEach(option => {
$(".questionBox").append('<span class="pilihan">' option ' </span><br>');
});
}
$(".secondBox").append('<a href="Listening Part A.html" class="btnToPartB">Continue to Part B</a>');
};
$(".questionBox").on("click", "span.pilihan", function() {
Array.from(document.getElementsByClassName("pilihan"))
.forEach((element) => element.style.backgroundColor = "red");
});
Тем не менее, я хочу, чтобы только один щелчок изменил цвет , не все span.pilihan
, но мой код выше изменил цвет на красный.
Есть идеи?
Комментарии:
1. «но мой код выше меняет весь цвет на красный» — Потому что это именно то, что вы сказали сценарию сделать… ->
Array.from(...).forEach(...)
2.Учебный центр jQuery -> События,
.on()
3. Есть идеи, как изменить только тот, на который нажали? @Андреас
4. Конечно. Вы также получите его, если проверите ссылки, которые я добавил в своем втором комментарии.
Ответ №1:
Напиши это:
$(".questionBox").on("click", ".pilihan", function() {
$(this).css("background", "red");
});