javascript - 如何从切换开关 JavaScript 获取输入

Question

我的 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>`
  );

它显示得很好，并且正在打开和关闭，正如我们在这里看到的那样。

我的问题是它什么都不做。我想在打开时将变量设置为 true，在关闭时设置为 false。

假设我有 var isRequired 并且我想通过这个切换开关设置它。我想做类似的事情:

if (questionRequired.isTurnedOn)
    isRequired = true;
else isRequired = false;

有人知道我该怎么做吗？谢谢。

Answer 1

这是一个简化的例子。

在您的复选框 上创建一个eventListener，以及bool 变量。

isChecked = isChecked ? false : true; 基本上意味着如果值为 false，则将其设置为 true，反之亦然。

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" />