JavaScriptでチェックボックスの状態を取得したいと考えております。お力添え頂けないでしょうか。

Question

いつも親切な回答をありがとうございます。

ご回答いただけたら有難いです。宜しくお願い致します。

id値を振ったチェックボックスをonClickを使い
JavaScriptでチェックボックスの状態（true or false)を
取得したいのですが、サンプルコードをご提示いただけないでしょうか。

HTML側のサンプルコードは、以下です。
<input type="checkbox" id="accordion-one" name="accordion-group">
<label for="accordion-one" onclick="resizeOne();">ロビー受付</label>

宜しくお願い致します。

Answer 1

ラベルにonclickで処理するのはどうかと思います

<script>
function resizeOne(n){
  console.log(n.checked);
}
</script>
<input type="checkbox" id="accordion-one" name="accordion-group" onchange="resizeOne(this);">
<label for="accordion-one">ロビー受付</label> 

もしくはdocument.getElementByIdで指定するかですね

Comments

[shizimi]

ご回答ありがとうございます。確かにlabelにonClickはあまりしないですね。修正点に気づくことができました。ありがとうございました。

Answer 2

var checkbox = document.getElementById('accordion-one');

checkbox.onclick = function(){
    console.log(checkbox.checked);
};

で取得できます。

上記はcheckboxのcheckedプロパティを参照するコードになっています。
checkboxのチェック状態を取得する場合は、属性値ではなく、上記のようにプロパティを参照する必要があります。属性値とプロパティの違いは理解されていますか？

Comments

[shizimi]

ご指摘頂いた通り、理解が足りませんでした。onClickで押された場所を取得して　属性でプロパティを取得しようとしていたため今までできませんでした。ありがとうございました。