Wywołanie funkcji w addEventListener

0

Cześć,
Prośba o pomoc z uruchomieniem prostego skryptu. Dodaje nasłuchiwanie do przycisku w html i wywoluje funkcję, która niestety nie uruchamia się. Kiedy wywołuję tę samą funkcje w konsoli skrypt działa tak jak powinien.
html:

 <main class="container">
        <div class="lesson">
            <h2>Struktury danych - obiekty i tablice</h2>
            <h3>Suma przedziału liczb</h3>
            <p>Napisz funkcję o nazwie "range" przyjmującą dwa argumenty: "start" i "end", i zwracającą tablicę
                wszystkich liczb od "start" do "end" włącznie.</p>
            <hr>
            <label for="start">Start:</label><br>
            <input type="text" id="start"><br><br>
            <label for="end">End:</label><br>
            <input type="text" id="end"><br><br>
            <button id="print">Wyświetlaj!</button>
            <hr>
            <div id="lesson1a">

            </div>
        </div>
    </main>

js:

const btn = document.querySelector("#print");
const lesson1a = document.querySelector("#lesson1a");
const start = document.querySelector("#start");
const end = document.querySelector("#end");

const range = (x,y) => {

    for(i = x; i<=y; i++){
        //console.log(i);
        const div = document.createElement('div');
        div.textContent = i;
        lesson1a.appendChild(div);
        
    }   
}

btn.addEventListener("click", range(parseInt(start.value),parseInt(end.value)));

Funkcja wywołana z konsoli:
screenshot-20211202102437.png

Z góry dziękuję za pomoc

2

Nie działa, ponieważ jeśli chcesz przekazać jakiś parametr do funkcji, która ma się wywołać podczas jakiegoś zdarzenia, to musisz to zrobić w anonimowym callbacku eventListenera. Poniżej zostawiam Ci przykład, byś zobaczył, jak działa listener wywołujący funkcję z parametrem i bez parametru:

const button = document.querySelector('button');

function logName() {
    console.log('Name');
}

function logName2(name) {
    console.log(name);
}

button.addEventListener('click', logName);
button.addEventListener('click', () => logName2('Name2'));
0

@angry bread: Wielkie dzięki

1 użytkowników online, w tym zalogowanych: 0, gości: 1