jquery .find работает во всех браузерах, кроме IE

Question

У меня есть дерево с ul и li.Каждый ли имеет флажок с текстом.Мне нужно проверить все дочерние элементы, когда родительский элемент проверен.Я сделал это с помощью следующего кода, который работает в FF и Chrome, но не в IE ...

function checkSC(el){

var $parent = $(el).parent();
$($parent).find('input[type="checkbox"]').attr("checked", el.checked);

}

HTML выглядит так:

<ul id="treeUL" class="treeview-black treeview">
  <li class="collapsable">
   <div class="hitarea collapsable-hitarea"></div>
   <input type="checkbox" onchange="checkSC(this)" value="26" name="chkComm">
    Conseil d'Administration
   <ul>
      <li>
        <input type="checkbox" onchange="checkSC(this)" value="29" name="chkComm[29]">
        Bureau
      </li>
      <li>
        <input type="checkbox" onchange="checkSC(this)" value="31" name="chkComm[31]">
        Comité de Direction
      </li>
      <li class="last">
      <input type="checkbox" onchange="checkSC(this)" value="62" name="chkComm[62]">
       Administrateurs Suppléants
      </li>
   </ul>
</li>

Answer 1

Используйте вместо этого onclick.IE, кажется, ждет, пока вы не размыли флажок.Кроме того, если вы используете jQuery, используйте его для назначения обработчиков событий объектам вместо встроенных функций.

$(document).ready( function() {

    $("input[type='checkbox']").click( function() {
         $(this).parent().find('input[type="checkbox"]').attr("checked", this.checked);
    });

});

Возможно, вы захотите изменить селектор, если вы добавляете этот обработчик только к определенным флажкам.

Answer 2

$ parent уже является объектом jQuery. Вам не нужно оборачивать его в другой объект jQuery. Это то же самое, что делать:

$( $("#target_id") )

Answer 3

Попробуйте «onclick» вместо «onchange». onchange не является допустимым событием для флажка. см http://www.w3schools.com/jsref/event_onchange.asp

Answer 4

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

Эта статья http://forloop.co.uk/event-internals-in-jquery-part-one, которая объясняет, как jQuery обрабатывает события, как интересное предупреждение о разнице между моделями в том, как this интерпретируется в событиях:

Что это внутри функции обработчика?

Одним из самых больших различий между моделями W3C и IE является то, что ключевое слово this (контекст функции) относится к событию функция обработчика; в модели W3C это ссылка на элемент к которому привязан обработчик события, но в IE это относится к глобальный объект (объект окна в браузерах). Это может действительно поездка если вы не обращаете внимания!

Решение состоит в том, чтобы связать ваш обработчик с помощью jQuery и, таким образом, не иметь дело с различиями в разных браузерах.