JavaScript - チェックボックスの情報を取得する

チェックボックスの情報の取得

/* HTML側 */
<label for="checkboxA">
  <input type="checkbox" id="checkboxA" value="A" /> チェックボックスA
</label>

<label for="checkboxB">
  <input type="checkbox" id="checkboxB" value="B" checked/> チェックボックスB
</label>

/* JavaScript 側 */
var checkboxA = document.getElementById("checkboxA");
var checkboxB = document.getElementById("checkboxB");

console.log(checkboxA.checked); // false
console.log(checkboxA.checked); // true
チェックボックスの情報の取得

チェックボックスの変更の検知

/* HTML側 */
<label for="checkboxA">
  <input type="checkbox" id="checkboxA" value="A" /> チェックボックスA
</label>

/* JavaScript 側 */
var checkboxA = document.getElementById("checkboxA");

// 状態が変化したときにイベントが発生
checkboxA.addEventListener('change', (event) => {
  // 処理内容
});
チェックボックスの変更の検知

関連記事