次の HTML をより短く、より理解しやすいように編集しました。
<input type='checkbox' name='All' value='All' id='All' onclick='toggleAll(this)'/>
<label for='All'> Everyone</label>
<input type='checkbox' name='Resp' value='Resp' id='Resp' onclick='toggleResp(this)'/>
<label for='Resp'> Responsibles</label>
<input type='checkbox' name='9' value='9' id='9' onclick='toggleDept(this)' />
<label for='9'> Department 9</label>
<input type='checkbox' name='3-9-9' value='3-9-9' id='3-9-9' />
<label for='3-9-9'> Responsible Personnel 9</label>
<input type='checkbox' name='4-9-10' value='4-9-10' id='4-9-10' />
<label for='4-9-10'> General Personnel 10</label>
<input type='checkbox' name='4-9-11' value='4-9-11' id='4-9-11' />
<label for='4-9-11'> General Personnel 11</label>
名前4-9-10
の 4 はユーザー タイプを表し、4 未満の場合はユーザーですresponsible
。9 は部門 ID、10 は人事 ID を表します。
チェックボックスをクリックするとAll
、すべてのチェックボックスがチェックされます。
function toggleAll(source) {
inputs = document.getElementsByTagName("input");
for (var i in inputs) {
if(inputs[i].type == "checkbox") {
inputs[i].checked = source.checked;
}
}
}
チェックボックスをクリックするResp
と、担当者のチェックボックスがすべてチェックされます。
function toggleResp(source) {
inputs = document.getElementsByTagName("input");
for (var i in inputs) {
if (inputs[i].type == "checkbox") {
if(parseInt(inputs[i].name.substring(0, inputs[i].name.indexOf("-"))) < 4)
inputs[i].checked = source.checked;
}
}
}
部門のチェックボックスをクリックすると、部門の担当者のチェックボックスがオンになります。
function toggleDept(source) {
inputs = document.getElementsByTagName("input");
deptId = source.name;
for (var i in inputs) {
if (inputs[i].type == "checkbox") {
index = inputs[i].name.indexOf("-");
lastIndex = inputs[i].name.lastIndexOf("-");
iDeptId = inputs[i].name.substring(index + 1, lastIndex);
if (index != -1 && iDeptId == deptId.toString())
inputs[i].checked = source.checked;
}
}
}
私には 3 つの部門があり、それらにはさまざまな数の人員がいます。すべてが Firefox、Chrome、Yandex でうまく機能します。ただし、これは IE7 では部分的にしか機能しません。例えば、 を押すとAll
、部門責任者と部門だけがチェックされ、部門はまったくチェックされません。Responsible
チェックし、Department
部分的にも動作します。
私の質問は、以前のバージョンの IE7 と互換性のない関数または HTML 要素がコードに含まれていますか?