JQuery в Internet Explorer - выбор столбцов таблицы - PullRequest
Новая
       21

JQuery в Internet Explorer - выбор столбцов таблицы

0 голосов
/ 13 ноября 2010

Я пытаюсь сделать динамическое изменение размера столбцов таблицы на моей странице.Все хорошо работает в FF и Chrome, но (как обычно) в Internet Explorer, похоже, ломается.После многих отладок я обнаружил, что проблема вызвана тем, что селекторы JQuery не работают правильно в Internet Explorer, когда вы работаете с таблицами.Может показаться, что если вы пытаетесь выбрать столбец в многострочной таблице, JQuery выберет только первый столбец.Вот небольшой код, который покажет проблему. 

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("td#2").css('background-color', 'red');  
});
</script>
</head>

<body>
<table>
<tbody>
<tr><td id="1">1</td><td id="2">2</td></tr>
<tr><td id="1">1</td><td id="2">2</td></tr>
</tbody>
</table>
</body>
</html>

Вы заметите, что в IE выделяется только первая цифра «2».Следует (если я правильно понимаю мой собственный код) выделить оба из 2.Любые идеи для обхода этого?

1 Ответ

3 голосов
/ 13 ноября 2010

Вместо идентификатора (который должен быть уникальный , ваша текущая проблема), используйте class и $("td.2"), или ни одного ... и используйте :nth-child() вот так: 

$(document).ready(function(){
  $("td:nth-child(2)").css('background-color', 'red');  
});

С этим ваша разметка становится намного проще: 

<table>
    <tbody>
        <tr><td>1</td><td>2</td></tr>
        <tr><td>1</td><td>2</td></tr>
    </tbody>
</table>

Вы можете проверить это здесь - и для сравнения вот версия класса .

...