コード スニペットの行を表すチェックボックスのグループがあります。チェックボックスを2回クリックするだけで(コードの最初と最後の行で)そのコードの一部を選択し、中央のコードをチェックして、選択の開始行と終了行で2つの入力フィールドを設定したいと思います。これが私のコードですが、まったく機能していないようです。
HTMLコード
<div id="example">
<input type="checkbox" name="box1" id="box1">
<label for="box1"> code line 1 </label>
<input type="checkbox" name="box2" id="box2">
<label for="box2"> code line 2 </label>
<input type="checkbox" name="box3" id="box3">
<label for="box3"> code line 3 </label>
<input type="checkbox" name="box4" id="box4">
<label for="box4"> code line 4 </label>
<input type="checkbox" name="box5" id="box5">
<label for="box5"> code line 5 </label>
</div>
<form name="addhint" method="post" action="">
<input type="hidden" name="start" value="0">
<input type="hidden" name="stop" value="0">
[...]
</form>
Jクエリコード
$('#example input:checkbox').click(function() {
var $this = $(this);
var $id= $this.id;
if ($this.is(':checked')) {
if ($('#form input[name=start]').val() == 0) {
$('#form input[name=start]').val($id);
}
else {
var $start= $('input[name=start]').val();
if ($id - $start > 1) {
for ($i = $start+1; $i < $id; $i++) {
$('#example input[id=box'+$i+']').attr('checked', true);
$('#example input[id=box'+$i+']').attr('disabled', 'disabled');
}
$('#form input[name=stop]').val($id);
}
}
} else {
// do other stuff
}
});
チェックボックスをクリックしても何も起こりません。jQuery を使用するのは初めてなので、多くのことが間違っている可能性があります。私を殺さないでください.. :)