Tengo este interruptor de palanca en mi código JavaScript:
var questionRequired = document.createElement("div"); questionRequired.className = "mt-1 mb-1"; questionRequired.insertAdjacentHTML( "beforeend", `<label class="custom-control ios-switch"> <input type="checkbox" class="ios-switch-control-input" /> <span class="ios-switch-control-indicator"></span> <span class="ios-switch-control-description">Required</span> </label>` );Se muestra muy bien y se enciende y apaga como podemos ver aquí.
Mi problema es que no hace nada. Quiero establecer una variable como verdadera si está activada y como falsa cuando está desactivada.
Digamos que tengo var isRequired y quiero configurarlo a través de este interruptor de palanca. Quiero hacer algo como:
if (questionRequired.isTurnedOn) isRequired = true; else isRequired = false;¿Alguien sabe cómo puedo hacer esto? Gracias.
Aquí hay un ejemplo simplificado.
Cree un eventListener en su checkbox de verificación, así como una variable bool .
isChecked = isChecked ? false : true; básicamente significa que si el valor es false , configúrelo como true y viceversa.
var chxBox = document.querySelector(".ios-switch-control-input"); var isChecked = false; //false because the checkbox is unchecked on page load chxBox.addEventListener("change", function(){ isChecked = isChecked ? false : true; console.log(isChecked) }) <input type="checkbox" class="ios-switch-control-input" />prueba esto
var checked = false var questionRequired = document.createElement("div"); questionRequired.className = "mt-1 mb-1"; questionRequired.insertAdjacentHTML( "beforeend", `<label class="custom-control ios-switch"> <input onChange="isChecked()" type="checkbox" class="ios-switch-control-input" /> <span class="ios-switch-control-indicator">. </span> <span class="ios-switch-control-description">Required</span> </label>`) function isChecked(){ checked = checked?false:true return checked } console.log(checked)