Fang this.id innen for-Schleife (JS)

Question

HTML

<button class="button" id="1">Button 1</button> 
<button class="button" id="2">Button 2</button> 

JS

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

function chooseButton() { 
    // works 
    let buttonId = this.id; 
    console.log('You choose button' + buttonId); 
}; 

// Check for button click 
for (var i = 0; i < button.length; i++) { 
    button[i].addEventListener('click', chooseButton, false); 
} 

Wie kann ich für buttonId hören, es fangen und es außerhalb der Funktion nutzen?

if (buttonId == 1) { 
    // do this 
} 

Answer 1

Sie benötigen die buttonId Variable außerhalb der Funktion zu definieren:

const button = document.getElementsByClassName('button'); 
 
let buttonId; 
 
function chooseButton() { 
 
    buttonId = this.id 
 
    console.log('You choose button' + buttonId); 
 
    checkerFunction(); 
 
}; 
 
for (var i = 0; i < button.length; i++) { 
 
    button[i].addEventListener('click', chooseButton, false); 
 
} 
 

 
function checkerFunction() 
 
{ 
 
    if (buttonId == 1) 
 
    { 
 
\t \t console.log('TEST :: You choose button' + buttonId); 
 
    } 
 
    else 
 
    { 
 
\t \t console.log('TEST :: You choose the other button' + buttonId); 
 
    } 
 

 
}

<button class="button" id="1">Button 1</button> 
 
<button class="button" id="2">Button 2</button>

Um sicherzustellen, dass der Wert lesbar ist, dass wir die checkerFunction nur zu Testzwecken nennen.

Answer 2

Sie sollten nicht let innerhalb Funktion verwenden, wenn Sie es außerhalb zugreifen möchten. Sollte sein

let buttonId; 
function chooseButton() { 
    // works 
    buttonId = this.id; 
    console.log('You choose button' + buttonId); 
};