選択 (複数を許可するように設定されている場合はリストボックス) を使用するか、一連のチェックボックスを使用するかはまだ決めていませんが、いずれの場合も、ユーザーが選択できる値の 1 つは「すべて」です。これはデフォルトで選択/チェックされている唯一の値ですが、ユーザーが他の値を選択/チェックした場合、「すべて」の値を選択解除/チェック解除する必要があります。また、その後、ユーザーがすべてのアイテム/チェックボックスを選択した場合、他のすべての選択を解除/チェックを外したいと思います。これはjQueryの仕事だと思いますが、それを達成する方法がわかりません...
アップデート
jQueryRocks の提案された回答への対応:
このhtmlで：
<td>
<select name="siteSelector" id="siteSelector" multiple="multiple" size="6">
<option value="all" selected="selected" id="selectAll">All</option>
<option class="options" value="1">1</option>
<option class="options" value="2">2</option>
<option class="options" value="3">3</option>
<option class="options" value="16">16</option>
<option class="options" value="26">26</option>
</select>
</td>
...そしてこのjQuery（完全を期すためにすべてを示しています）：
$(function () {
AnyTime.picker("BeginDateTime");
AnyTime.picker("EndDateTime");
$('#BeginDateTime').val(function(){
var d = new Date();
return d.getFullYear() + "-" + ('0' + (d.getMonth()+1)).slice(-2) + "-" + ('0' + d.getDate()).slice(-2) + " 00:00:00";
});
$('#EndDateTime').val(function(){
var d = new Date();
return d.getFullYear() + "-" + ('0' + (d.getMonth()+1)).slice(-2) + "-" + ('0' + d.getDate()).slice(-2) + " 23:59:59";
});
$('input#selectAll').click(function() {
if($(this).filter(':checked').val() !== undefined) {
$('input.options').prop('checked', true);
}
else {
$('input.options').prop('checked', false);
}
});
});
...「すべて」を選択してから他のものを選択でき、「すべて」が選択されたままになります (別の値を Ctrl キーを押しながらクリックすると)。私は何か間違ったことをしていますか？
あなたのコードに基づいて、htmlを次のように変更してみました:
<td>
<select name="siteSelector" id="siteSelector" multiple="multiple" size="6">
<option value="all" selected="selected" id="selectAll">All</option>
<option id="deselectAll" value="1">1</option>
<option id="deselectAll" value="2">2</option>
<option id="deselectAll" value="3">3</option>
<option id="deselectAll" value="16">16</option>
<option id="deselectAll" value="26">26</option>
</select>
</td>
...そしてこれに対する私の（関連する）jQuery：
$('input#deselectAll').click(function () {
if ($(this).filter(':checked').val() !== undefined) {
$('input#selectAll').prop('checked', false);
}
});
...しかし、それもうまくいきません。
更新 2
チェックボックスの祭典のために、これも試してみましたが、役に立ちませんでした：
html:
<td>
<INPUT NAME="sites" TYPE="CHECKBOX" VALUE="all">All
<BR>
<INPUT NAME="sites" TYPE="CHECKBOX" VALUE="1" id="options">1
<BR>
<INPUT NAME="sites" TYPE="CHECKBOX" VALUE="2" id="options">2
<BR>
<INPUT NAME="sites" TYPE="CHECKBOX" VALUE="3" id="options">3
<BR>
<INPUT NAME="sites" TYPE="CHECKBOX" VALUE="16" id="options">16
<BR>
<INPUT NAME="sites" TYPE="CHECKBOX" VALUE="26" id="options">26
<BR>
</td>
jQuery:
$('input.options').click(function() {
var allChecked = true;
var allUnchecked = true;
$('input.options').each(function() {
if($(this).filter(':checked').val() === undefined) {
allChecked = false;
}
else if($(this).filter(':checked').val() !== undefined) {
allUnchecked = false;
}
});
if(allChecked) {
$('input#selectAll').prop('checked', true);
}
else if(allUnchecked) {
$('input#selectAll').prop('checked', false);
}
});
...だから私はこれでjQueryを置き換えました：
$('input#options').click(function () {
var anyOptionsChecked;
$('input#options').each(function () {
if ($(this).filter(':checked').val() !== undefined) {
anyOptionsChecked = true;
}
});
if (anyOptionsChecked) {
$('input#selectAll').prop('checked', false);
}
});
...しかし、それもうまくいきません。
"if ($(this).filter(':checked').val() !== undefined) {" 行は代わりに:
if($(this).filter(':checked').val() == checked) {
-また：
if($(this).filter(':checked').val() === checked) {
-またはまったく別のものですか？