リンクチェックボックスを変数名、ID、値で設定する方法

Question

私はチェックボックスのリストの横にそれぞれリンクがあります。

<form name="checkboxlist" action="..." > 
    <input type="checkbox" id="1" name="pageCB" value="1"/> 
    <a id="1" href="#" onclick="sub(id)>click here</a> 
    <input type="checkbox" id="2" name="pageCB" value="2"/> 
    <a id="2" href="#" onclick="sub(id)>click here</a> 
    ... 
    ... 
    <input type="submit" /> 
</form> 

私は現在、使用しようとしています：ような何か

<script> 
    function sub(id){ 
     $("input:checkbox[value=id]").attr("checked", true); 
     document.checkboxlist.submit(); 
    } 
</script> 

しかし、これは明らかに変数IDを読み取らないと、いくつかのがあるので、私は本当にステートメント場合は、各IDのことを避けるしたいと思いますそれらの百人。これを行うにはいくつかの方法がありますか？

Answer 1

EDIT：あなたはまた、重複したIDを使用しています。これは無効で、IDで選択すると正常に機能しません。

---

HTML4では数値IDが無効です。これに

$("input:checkbox[value=id]") 

：

とにかく

、これを変更する。これは、セレクタ文字列にidの値を連結し

$("input:checkbox[value='" + id + "']") 

、と私はまた、彼ら以来、属性セレクタ値を囲む引用符を追加しましたドキュメントによって必要とされる。

そして、これにあなたのインラインハンドラを変更：thisは要素への参照がクリックされたので、this.idは、そのID属性への参照ですので...

<a id="2" href="#" onclick="sub(this.id)>click here</a> 

。

Answer 2

<label>タグを使用するリンクは使用しないでください。

これはそのためのものです。

<input type="checkbox" name="mybox" id="mybox"> 
<label for="mybox">Click this box</label> 

これはすべてのフォームフィールドで機能し、既存のものを実行するためにJSをビルドするよりも優れています。

Answer 3

私が正しく理解していれば、関連する要素をクリックしてチェックボックスを選択し、クリックしてフォームを送信することをサポートしたいと考えています。私は示唆しているでしょう<a>の代わりに<label>要素を使用してください。それらはidの入力に関連付けることができます。b）数字の重複するid属性を使用しないでください。

<form name="checkboxlist" action="#"> 
    <input type="checkbox" id="a" name="pageCB" value="1"/> 
    <label for="a">Click here</label> 
    <input type="checkbox" id="b" name="pageCB" value="2"/> 
    <label for="b">Click here</label> 
</form>  

<script> 
    $(document).ready(function() { 
     $('input:checkbox').change(function(){ 
      $(this).parent('form').submit(); 
     }); 
    }); 
</script>