在Internet Explorer中的JQuery - 选择表列

我想在我的页面上做一些动态调整表格列的大小。在FF和Chrome中一切正常，但（像往常一样）它似乎在Internet Explorer中突破。经过大量调试后，我发现问题是由于JQuery选择器在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的两个。任何想法在这方面的解决方法？

来源

2010-11-13 jwegner

id属性在html中必须是唯一的 – Hogan 2010-11-13 15:17:40

相反的ID（它必须是独特的，你目前的问题），请使用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>

You can test it out here - 和比较，here's the class version。

来源

2010-11-13 15:00:19

谢谢Nick！这个特定的问题最终变成了别的东西（我从一个容器div中取得了一些css，让我感到困扰），但是我用你的提示修复了我的页面中的很多其他错误！愚蠢的我，开发自己的HTML/CSS/JS我从来没有得知ID需要是唯一的。哎呀！ – jwegner 2010-11-15 21:54:53

在Internet Explorer中的JQuery - 选择表列

回答

相关问题