IE8 - флажок не изменяет состояние при первом нажатии

Question

Я немного обыскал и не смог найти что-то, относящееся к моей конкретной проблеме, поэтому извиняюсь, если на этот вопрос был дан ответ в другом месте.

Я работаю над сайтом sharepoint 2010, используя веб-часть редактора контента с javascript и jQuery (1.7.2) для создания табличного дисплея, который можно фильтровать с помощью ряда флажков. В таблице собраны данные из ряда внутренних списков, которые я запрашиваю при загрузке страницы и сохраняю в структуру данных для построения таблицы. Браузер IE11 работает в режиме принудительной эмуляции IE8

Я столкнулся с проблемой, заключающейся в том, что некоторые флажки не меняют свое состояние при первом щелчке, но обработчик события щелчка по-прежнему срабатывает, и метод все еще правильно определяет текущее состояние.

Код выглядит примерно так (перефразировано, поскольку фактический код довольно длинный)

function filterActivity() {
  $('#displaytable').empty();

  //returns an array of keys sorted by the project's name
  //so that they appear in sorted order in display table
  //the key is sharepoint's internal listItem ID
  //but each project has an activity ID that uniquely identifies it
  var projectItems = sortByActivityName('projectDB');
  for (var i = 0; i < projectItems.length; i++) {
    var projectKey = projectItems[i];
    var projectItem = Lists['ProjectDB'][projectKey]; //get corresponding info from stored data

    var scheduleItems = sortByActivityName('scheduleDB');
    var endDate = '';
    for (var j = 0; j < scheduleItems.length; j++) {
      var scheduleKey = scheduleItems[j];
      var scheduleItem = Lists['ScheduleDB'][scheduleKey];

      if (projectItem.activity_ID == scheduleItem.activity_ID) {
        //get related records to the current project
        endDate = scheduleItem.endDate;
      }
    }
    //similar loops to get related records from other list

    var rowstring = "<tr>";
    if (projectItem.status == "Open" && $('#open_check').is(":checked")) {
      //if the project is open and the filter for showing open projects is checked, build the table row and append it
      rowstring += "<td>" + projectItem.displayName + "</td>";
      rowstring += "<td>" + endDate + "</td>";
      rowstring += "</tr>";
      $('#displaytable').append(rowstring);
    }
  }
}

<input type="checkbox" id="open_check" onclick="filterActivity()" value="Open" checked>
<table id="displaytable">
  <thead>
    <tr>
      <th>Name</th>
      <th>Project End Date</th>
    </tr>
  </thead>
  <tbody>
  </tbody>
</table>

Когда я запускаю страницу, при загрузке она корректно добавляет в таблицу только открытые проекты. Однако, когда я нажимаю на флажок «открыть», чтобы снять флажок и скрыть открытые проекты, флажок вызывает событие onclick и запускается, но состояние не меняется, что-то вроде

1. Страница загружается, флажок Открыть установлен, добавлены только открытые проекты
2. Установите флажок "Открыть"
3. Флажок Open остается установленным, обработчик onclick срабатывает и filterActivity() запускается
4. $("#open_check").is(":checked") возвращает true, и только открытые проекты снова добавляются в таблицу
5. Установите флажок "Открыть"
6. флажок "Открыть" становится не отмеченным
7. Правильное поведение, как и ожидалось, начиная с этого момента

Это, похоже, влияет только на флажки, которые специально запускают метод filterActivity(), остальные флажки на странице работают нормально. Это также противоречиво, так как в редких случаях флажок корректно изменяет состояние при первом щелчке.

Насколько я могу судить, это какое-то состояние гонки, но я не уверен, что его вызывает - есть ли блокирующее поведение в том, как IE8 управляет обработчиком кликов? Я не думаю, что это также проблема jQuery, так как я не использую jQuery для установки флажка, а состояние, определенное jQuery, похоже, соответствует тому, что показано.

Поскольку это устаревшая система, к сожалению, у меня нет возможности использовать более новый браузер или более новые версии jQuery.

Answer 1

Я глуп и пропустил лес за деревьями

В другом месте на странице я динамически создаю некоторые флажки и связываю обработчик щелчков с jQuery, однако я использовал селектор $('input:checkbox'), который ошибочно привязывает дополнительный обработчик щелчков к затронутым флажкам.

Изменение селектора для исключения не программно сгенерированных флажков решило проблему