別のボックスをチェックするチェックボックス

Question

私はチェックボックスがいっぱいのウェブページを扱っています。私は1つ（その親と呼ぶことにします）のチェックボックスにチェックボックスを付けることをお勧めします。これまでのところ、このjqueryコードで成功しました。

$(function(){ 
    $('#1').on('change',function(){ 
    $('#5,#456,#910,#1077,#982,#759,#1234,#392,#289,#956').prop('checked',$(this).prop('checked')); 
    }); 
    $('.child').on('change',function(){ 
    $('#parent').prop('checked',$('.child:checked').length ? true: false); 
    }); 

}); 

唯一のことは次のとおりです。私は "子"チェックボックスに機能を与え、 "親"チェックボックスがチェックされているときに機能させたいが、子チェックボックスが親チェックボックスでチェックされていると機能が動作していないように見える。カーソルで子ボックスを手動でチェックした場合のみ。

私の質問がはっきりしたことを願っています。私は通常、ここに

を上の投稿はありません:)

Answer 1

あなたはボックスをチェックして、jQueryを使ってクリックイベントをトリガするために$.trigger('click')ようなコードを使用することができます。

これを試してみてください：ここで

$('#1').on('change',function(){ 
    $('#5,#456,#910,#1077,#982,#759,#1234,#392,#289,#956').trigger('click'); 
}); 

はそれがより明確にするためにスタックスニペットです：

$(function(){ 
 
    $('#parent').click(function(){ 
 
    \t $('#1, #2, #3').trigger('click'); 
 
    }); 
 
    $('#1, #2, #3').click(function(){ 
 
     console.log(this.id); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
parent: <input type="checkbox" id="parent" /> 
 

 
<br /> 
 

 
<input type="checkbox" id="1" /> 
 
<input type="checkbox" id="2" /> 
 
<input type="checkbox" id="3" />