Así que tengo esta función de transliteración que necesito ejecutar si la casilla de verificación está marcada. El problema es que la función continúa ejecutándose después de que la casilla de verificación también esté desmarcada.
const checkBox = document.querySelector("#checkbox"); const input = document.querySelector("#input"); function transRussian(){ ch = ch.replace(/l/g, "л"); ch = ch.replace(/p/g, "п"); return ch; } checkBox.addEventListener('change',()=>{ if(checkBox.checked){ transliterate(); } else{ console.log("transliteration is turned off") } }); input.addEventListener('keyup',()=>{ var ch = input.value; transRussian(ch); input.value = ch; }); <input type="checkbox" id="checkbox"> <input type="text" id="input">En esta solución, si se hace clic en la checkbox de traducción, se llama al método translateBlock() y el texto dentro del elemento <textarea> se cambia de acuerdo con la lógica.
/* A let variable is declared, not a const, to change the content. */ let checkBox = document.getElementById('checkbox'); let input = document.getElementById('input'); function transRussian(ch){ ch = ch.replace(/l/g, "л"); ch = ch.replace(/p/g, "п"); return ch; } function translateBlock(){ var ch = input.value; input.value = transRussian(ch); } /* When the checkbox is clicked, the control variable is set to true. */ input.addEventListener('keyup', () => { if(checkBox.checked) translateBlock(); }); /* This method is triggered when data is entered in the <textarea> element. */ checkBox.addEventListener('change', () => { if(checkBox.checked) translateBlock(); else console.log("transliteration is turned off") }); textarea{ display: block; } <span>Translate</span> <input type="checkbox" id="checkbox"/> <textarea id="input" name="w3review" rows="4" cols="50"> At w3schools.com you will learn how to make a website. They offer free tutorials in all web development technologies. </textarea>