jQuery attr() 没有在 IE7 中返回答案

【问题标题】：jQuery attr() not returning in IE7jQuery attr() 没有在 IE7 中返回
【发布时间】：2011-07-28 17:54:07
【问题描述】：

这个让我难过。我在一些链接上使用“for”属性来识别它们应该作用的元素。在 Firefox、IE9 和 IE8 中一切似乎都运行良好……但 IE7 中断并返回“未定义”。

这是我正在使用的 jQuery 代码的要点：

$(document.ready(function() {
    var editor_icons = $('.edit-button');

    editor_icons.each(function() {
        var $this = $(this),
            parent = $('#' + $this.attr('for'));

        var left = parent.position().left + parent.innerWidth() - 58 - 3,
            top = parent.position().top + 3;

        // ... you get the point ...
    });
});

应该作用的示例 HTML 元素：

<div id="content_wrapper">
    <a class="edit-button" href="javascript:void(0);" for="index_primary_content" />
    <div id="index_primary_content">
        ....
    </div>
</div>

在你指出之前，我意识到锚不应该是自动关闭元素。我从我的应用程序发送的 HTML 是 <a></a>，而 IE 将其解释为 <a />。我在元素之间添加了&nbsp; 以确保它不是解释问题，并且我得到了完全相同的错误。

问题是$this.attr('for') 返回“未定义”，所以parent.position().left 抛出“对象为空或未定义”错误。

我稍微研究了一下监视变量，我可以看到选择器正在工作，并且$this 在这种情况下确实选择了正确的元素并且确实设置了“for”属性......但是 jQuery 不是我想找不到它。

正如我所说，它在 Firefox、IE9 和 IE8 中运行良好……只是在 IE7 中不行。想法？

作为参考，我使用的是 jQuery 1.6.2 ...

【问题讨论】：

您是否有理由需要使用for？您是否尝试过给<a> 及其对应的<div> 提供相同的类并以这种方式找到它？
这是一个 ASP.Net MVC 项目。锚链接是使用可重用控件动态创建的 - 我将锚映射到它链接到的元素的 ID，但控件不知道正在使用哪些类。是的，我还有其他方法可以做到这一点，但自定义属性最简单，而且似乎在其他任何地方都可以使用。
然后给它一个不同的名字。而不是for 使用target_ele 或其他东西，它应该仍然有效。你的编辑会冲你大喊大叫，但它应该有效。
杰克，将其作为解决方案发布。这并不理想……但它确实有效。

标签： jquery internet-explorer-7 attr

【解决方案1】：

我相信这是你的问题jQuery Bug Ticket

这是因为在 HTML 中使用的“for”属性实际上是“htmlFor”，例如在标签元素中。我怀疑 jQuery.props 中的任何特殊情况都是如此。 XML 文档没有得到这种特殊处理，因此“for”将是“for”。我不确定这是否值得修复，或者只是记录。

【讨论】：

事实证明，“for”在所有但 IE7 中都转换为“htmlFor”。我查看了实际的.attr() 扩展名，它会在检查.getAttribute() 之前自动将“for”转换为“htmlFor”。在我的情况下，.getAttribute('for') 返回了正确的值，但是 .getAttribute('htmlFor') 返回了 null ...所以 jQuery 返回了 undefined.

【解决方案2】：

使用自定义属性代替for；以target_ele 为例。

你的编辑会对你大喊大叫，但它会起作用。

【讨论】：

决定为我的自定义属性使用“父”，因为它与我正在做的事情密切相关。我仍然想知道为什么不允许使用“for”。它是其他 HTML 元素的有效属性，那么为什么 jQuery 将其限制为仅标签？我想这是另一天的问题......
对 HTML5 自定义属性使用 data-for。
另外，“for”不是不允许的......请参阅我对@Hexxagonal 回答的评论，了解为什么这不适用于 IE7。