これの他の例を見たことがありますが、これが正しく機能するようにはなりませんでした。私が見た例も、通常のチェックボックスを使用しているだけです。クラスを使用して、スプライト シートでチェックボックスのスタイルを設定したので、これらの他の例のアイデアを自分のケースに適用するのに少し苦労しました。
マークアップは次のとおりです。
<div id="showHideAll"">Show/Hide All<input type="checkbox" id="allCheck" name="pinSet" class="pinToggles" onclick="checkAllLinks()">
<label for="allCheck" class="css-label"></label></div>
</div>
<div>Opt1<input type="checkbox" id="opt1Check" name="pinSet" class="pinToggles" onclick="checkOpt1Links()">
<label for="opt1Check" class="css-label"></label>
</div>
<div>Opt2<input type="checkbox" id="opt2Check" name="pinSet" class="pinToggles" onclick="checkOpt2Links()">
<label for="opt2Check" class="css-label"></label>
</div>
<div>Opt3<input type="checkbox" id="opt3Check" name="pinSet" class="pinToggles" onclick="checkOpt3Links()">
<label for="dinShopCheck" class="css-label"></label>
</div>
checked プロパティは、css クラスを使用してスプライトを変更するものです。
input[type=checkbox].pinToggles:checked + label.css-label {
background-position: 0 -16px;
}
これのほとんどは他の機能のためのものですが、念のため表示すると思います。
これは、個々のチェックボックスを設定する方法です。
function checkOpt1Links(){
$('#opt1 li a').toggleClass("inactive");
if(opt1.getVisible() == true)
{
opt1.setOptions({visible:false});
}
else
{
opt1.setOptions({visible:true});
}
}
私が探しているのは、典型的なすべてのチェックボックスを選択する機能です。チェックするとすべてのボックスがチェックされ、チェックを外すとすべてのチェックが外されますが、すべてを選択するときにボックスをクリックするとすべてが選択され、クリックされたチェックボックスがオフになり、逆に。私はこの例を見ました:Jqueryの「すべて選択」チェックボックス ですが、それを機能させるのに苦労しています。助けてくれてありがとう!