Javascript Проверка не работает в IE7

Question

У меня есть следующие 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 - идентификатор отдела, а 10 - идентификационный номер персонала.

При нажатии на флажке 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 работает частично, тоже.

Мой вопрос: есть ли в моих кодах функция или элемент HTML, которая несовместима с более ранними версиями IE7?

Answer 1

вы увидите проблему, как как только вы откроете свой отладчик в IE 7 - нажмите F12

'inputs[...].type' is null or not an object

IE не любит '9' как ID и он бросает исключение, когда он работает inputs[i] с 9 в качестве идентификатора

Как уже упоминалось mplungjan, его лучше изменить свой JavaScript, как показано ниже. Только изменен первый, хотя

function toggleAll(source) { 
    inputs = document.getElementsByTagName("input"); 
    for (var i=0; i<inputs.length; i++) { 
     var input = inputs[i]; 
     if(input.type == "checkbox") { 
      input.checked = source.checked; 
     } 
    } 
} 

Answer 2

Пожалуйста, не используйте for in петли, когда вы перебирать коллекций и массивов

Вы должны всегда использовать

for (var i=0, n=collection.length;i<n;i++) 

с массивами и коллекциями, которые document.getElementsByTagName является