Internet Explorer 7 从 jQuery 类选择器返回“未定义”答案

【问题标题】：Internet Explorer 7 returns 'undefined' from jQuery class selectorInternet Explorer 7 从 jQuery 类选择器返回“未定义”
【发布时间】：2011-04-24 12:29:11
【问题描述】：

我有一个小的 JavaScript 函数（除其他外）检索具有特定类名的最后一个元素的 ID。

var lastRowID = $(".sectionRow:last").attr('id');

它应该在类似于以下的表格中找到元素：

<table>
    <tr id="courseSection[0]" class="sectionRow"><td>stuff</td></tr>
    <tr id="courseSection[1]" class="sectionRow"><td>more stuff</td><td><a href="javascript:removeSectionRow(1)">(remove)</a></td><td><a href="javascript:addSectionRow()">(add additional row)</a></td></tr>
</table>

如果我快速输入alert(lastRowID)，我会在 Chrome、Firefox 和 IE8 中获得“courseSection[1]”。但是，IE7 讨厌我并说“未定义”。

注意：我也试过$(".sectionRow").last().attr('id')，但没有成功。

对可能发生的事情有什么想法吗？谢谢！

编辑：此表是在单击按钮时使用 javascript 添加的（按钮显示/添加表单的下一部分）。因此，页面加载时 DOM 中的不是静态 html。

当点击删除链接时调用 removeSectionRow(n) 函数。它删除指定的行，然后搜索类名称为“sectionRow”的最后一行，以便为该行提供“添加附加行”链接。这个想法是用户可以随意添加和删除行。这是完成结果的屏幕截图，以说明我可能难以解释的内容：http://imgur.com/uXYHj.png

【问题讨论】：

点击某个链接时，代码正在运行。编辑问题以（希望）更好地解释。表本身是在 javascript 页面加载后创建和插入的。这导致了一个有趣的 IE7 错误，除非我使用“tbody”标签，否则表格不会/render/（来源：linkyy.com/1dE）。
我会在表格中添加一个<tbody>，因为浏览器可能会插入一个。然后你就会有一致性。真的不应该有任何问题。有什么理由不让 jQuery 管理用于创建/删除行的处理程序？无论如何，我猜其中一个函数存在一些问题。

标签： javascript jquery internet-explorer jquery-selectors

【解决方案1】：

字符 [ 和 ] 不是有效的 ID 字符。也许这会在 IE7 中引起一些问题。

测试选择器返回的元素数量，看看你是否得到<tr>。

alert( $(".sectionRow:last").length );

【讨论】：

很高兴了解括号！接下来我会尝试删除那些。警报返回 0，所以它没有找到任何一个。
有关什么是/无效作为 id 属性的一些详细信息，请参阅此问题：stackoverflow.com/questions/70579/…
@Erik - 在 IE7 中测试，我没有任何问题。您是否有机会在问题代码中编辑问题？如果你做alert( $(".sectionRow").length );怎么样？
很可能——我刚刚尝试了下面的 jsfiddle.net 链接，我的示例似乎在 IE7 中运行良好。让我看看我是否可以将上下文的范围扩大一点。

【解决方案2】：

可能是因为它是无效的 HTML？你需要<td>标签。为我在 IE8 中工作。

http://jsfiddle.net/VCpZq/

【讨论】：

真正的代码里面有。它在 IE8 中运行良好，确实 :)
啊..没有安装IE7。对不起;)
别担心！直到今天早上一个用户找到我并告诉我关于 IE7 上的这个错误，我也没有。我必须找到一台装有 IE7 的机器才能复制它。我最终使用了一个名为“IETester”的程序，它实际上相当不错（而且免费！）