Селектор класса jQuery не работает в IE6 / 7? - PullRequest
1 голос
/ 12 июля 2011

У меня проблема с jQuery 1.5.1 (невозможно обновить, слишком поздно в нашем цикле разработки) и селекторами классов в IE6 и 7.

У меня есть div на странице, для которого я использую Javascript, чтобы создать еще один div и вставить его в существующий div. Созданный div имеет класс my-class-name. Для этого класса нет стиля, он просто служит общим «маркерным» классом.

Когда я использую этот селектор, он всегда возвращается пустым: $('.my-class-name').length // always zero.

Отлично работает в IE8 + и во всех других браузерах. Есть идеи?

EDIT: Это похоже на мой код.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <title>Test page</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
      var i = 0;

      function addContent() {
        var newDiv = document.createElement('div');
        newDiv.setAttribute('id', 'newdiv-' + i);
        newDiv.setAttribute('class', 'my-class');

        var nc = $('#NewContent');
        nc.append(newDiv);

        i += 1;
      }

      function showContentCount() {
        alert($('.my-class').length);
      }
    </script>
  </head>
  <body>
    <div>
      <p>Some content</p>
      <input type="button" onclick="javascript:addContent();" value="Add new content" />
      <input type="button" onclick="javascript:showContentCount();" value="Show new content count" />
      <div id="NewContent"></div>
    </div>
  </body>
</html>

IE8 + работает нормально, только 6 и 7 доставляют мне проблемы.

Ответы [ 2 ]

1 голос
/ 12 июля 2011

Я нашел ответ.Причина в том, что IE6 / 7 не использует class для атрибута класса.Вместо этого они используют className.Таким образом, строка newDiv.setAttribute('class', 'my-class'); не имеет желаемого эффекта, вместо этого она должна быть newDiv.setAttribute('className', 'my-class');.Я ввел некоторую логику, чтобы объяснить это, и теперь все работает так, как ожидалось.

0 голосов
/ 12 июля 2011

Есть еще одна причина, которая еще не обнаружена. Попробуйте отладить с помощью:

alert ( $('.my-class-name').length );
var mylen =  $('.my-class-name').length;
alert(mylen);
var mynewLen = $('.my-class-name').size();
alert(mynewLen);

.size() - это псевдоним jQuery для .length

Какая версия jQuery? Что еще есть на странице?

ПРИМЕЧАНИЕ: ЕСЛИ это на динамически создаваемых элементах, это нужно будет запускать ПОСЛЕ того, как элементы находятся в DOM.

РЕДАКТИРОВАТЬ: Примечание, чтобы попробовать это

$('div.my-class-name').length;

Примечание: селекторы классов в некоторых версиях jQuery не будут работать должным образом в некоторых контекстах - например, когда элементы VML находятся на странице (см. Ошибку jQuery # 7071). Я полностью стреляю в темноте, хотя здесь. Обходной путь: удалите .live () на странице, обновите до jQuery версии 1.6.1+ и используйте .delegate () вместо .live ();

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...