05. Highlight Active

Във форума е въведено ограничение, което позволява на потребителите единствено да разглеждат публикуваните въпроси.

Iskren.1990 6 Точки

05. Highlight Active

Идея защо при мен си работи а Judge не ?

https://judge.softuni.bg/Contests/Practice/Index/2238#4

https://pastebin.com/VMSC9DZi

let focusEvent = document.createEvent('UIEvents');
focusEvent.initEvent('focus', true, true);
let blurEvent = document.createEvent('UIEvents');
blurEvent.initEvent('blur', true, true);

// Focus second div
let div = document.getElementById('d2');
div.querySelector('input').dispatchEvent(focusEvent);

let allDivs = document.querySelectorAll('div div');
expect(allDivs[0].className).to.not.contains('focused', "Wrong div was highlighted");
expect(allDivs[1].className).to.contains('focused', "Div was not highlighted");
expect(allDivs[2].className).to.not.contains('focused', "Wrong div was highlighted");
expect(allDivs[3].className).to.not.contains('focused', "Wrong div was highlighted");

Unexpected error: Div was not highlighted: expected '' to include 'focused'

Тагове:

11/04/2020 15:52:29 Module: JS Advanced

Виж всички отговори

v.vachev 14 Точки

Best Answer

Замени focusin/focusout с focus/blur

function focus() {
    let mainDiv = document.getElementsByTagName("div")[0];

    Array.from(mainDiv.getElementsByTagName("input")).forEach(element => {
        element.addEventListener("focus",focus);
    });

    Array.from(mainDiv.getElementsByTagName("input")).forEach(element => {
        element.addEventListener("blur",focusLost);
    });


    function focus(e) {
        let parent = e.target.parentNode;
       parent.classList.add("focused");
    }


    function focusLost(e) {
        let parent = e.target.parentNode;
       parent.classList.remove("focused");
    }

 }

03/09/2020 23:25:35

tstephanov_su 2 Точки

Здравейте,

Въпреки, 2-те години по-късно, още едно решение се надявам да бъде от полза за някого търсещ - както бях аз.

Благодаря на v.vachev и Iskren.1990 за подхода и съветите им тук.

function focused() {
    let inputElements = document.querySelectorAll('div div input');

    // With assistance from Soft-Uni forum - https://softuni.bg/forum/30364/05-highlight-active
    for (let element of inputElements) {
        element.addEventListener('focus', (e) => {
            // set 'focused' class for click event element
            e.target.parentNode.classList.add('focused');            
        });

        element.addEventListener('blur', (e) => {
            // remove 'focused' class
            e.target.parentNode.classList.remove('focused');
        });
    }
}

15/02/2023 16:02:00 15/02/2023 16:04:29

Виж всички отговори