フォーム：複数選択のチェックボックスで「すべて選択」ボタン

Question

「すべてを選択」ボタンと「すべて削除」ボタンを自分のフォームで機能させるようにしようとしていますが、実際、チェックボックスのname属性に "[]"（配列）を取り除くと、そのjavascriptコードは完全に機能します。しかし、私はこれらのチェックボックスを複数選択する必要がありますので、コードは機能しません。

私はここでチェックボックスに関連したHTMLとJSコードを残していますが、もっとグラフィカルに確認することができますので、私は、これはフィドルをJSチェックすることをお勧めいたします：

https://jsfiddle.net/28dsnmxs/

HTMLコード：

を

<input type="checkbox" name="h[]" value="1" id="g"> SMS 
<br/> 
<input type="checkbox" name="h[]" value="2" id="g"> E-mail 
<br/> 
<input type="checkbox" name="h[]" value="3" id="g"> Phone 
<br/> 
<input type="button" id="prueba" name="sub" value="Check all"  onclick="checkall(document.formulario.h)"> 
<input type="button" name="sub" value="Uncheck all" onclick="uncheckall(document.formulario.h)"> 

JSコード：

function checkall(chk) { 

    var i; 
    for (i = 0; i < chk.length; i++) { 
     chk[i].checked = true; 
    } 

} 
function uncheckall(chk) { 
    var i; 
    for (i = 0; i < chk.length; i++) { 
     chk[i].checked = false; 
    } 
} 

どうすれば動作させることができますか？ jQueryを避けるアイデアが好まれますが、それ以外の方法がない場合は問題ありません。ありがとうございました！

Answer 1

すべてname = "h[]"要素

function checkall(chk) { 
 
    var i; 
 
    for (i = 0; i < chk.length; i++) { 
 
    chk[i].checked = true; 
 
    } 
 

 
} 
 

 
function uncheckall(chk) { 
 
    var i; 
 
    for (i = 0; i < chk.length; i++) { 
 
    chk[i].checked = false; 
 
    } 
 
}

<form method="POST" action="" name="formulario" id="form"> 
 
    <input type="checkbox" name="h[]" value="1" id="g">SMS 
 
    <br/> 
 
    <input type="checkbox" name="h[]" value="2" id="g">E-mail 
 
    <br/> 
 
    <input type="checkbox" name="h[]" value="3" id="g">Phone 
 
    <br/> 
 
    <input type="button" id="prueba" name="sub" value="Check all" onclick="checkall(document.formulario['h[]'])"> 
 
    <input type="button" name="sub" value="Uncheck all" onclick="uncheckall(document.formulario['h[]'])"> 
 
</form>

を選択するために使用 document.formulario['h[]'] bracket-notation

を使用し、有効なJavaScript Identifierないオブジェクトのキーにアクセスするには