IE8中的jQuery圆角+焦点（）答案

【问题标题】：jQuery rounded corners + focus() in IE8IE8中的jQuery圆角+焦点（）
【发布时间】：2012-07-28 10:47:53
【问题描述】：

我正在用 ASP.NET MVC 开发一个 Web 应用程序。我最近使用 jQuery Rounded Corners 插件 (http://plugins.jquery.com/project/corners) 添加了圆角。这似乎让 IE8（但不是 6 或 7，或 Firefox）感到不安，因为我不能再在 $(document).ready() 中设置焦点。

这是一个问题的例子：

    $(document).ready(function() {

        // using jQuery rounded corners plugin
        $("#centre").corners();

        // this doesn't have any effect in IE8
        $("#emailAddress").focus();
    });

#centre 包含我们的登录页面，#emailAddress 是其中的第一个字段。

emailAddress 字段应该获得输入焦点。它在 IE6 & 7 和 Firefox 中有效，但在 IE8 中没有。如果你注释掉两条圆角线，那么它就可以了。

我也试过将焦点线移到 $(window).load():

    $(window).load(function() {
        $("#emailAddress").focus();
    });

这也不起作用。但是，如果我使用超时设置焦点，那么它可以工作：

    $(document).ready(function() {

        // using jQuery rounded corners plugin
        $("#centre").corners();

        // this doesn't have any effect in IE8
        setTimeout(function() { $("#emailAddress").focus(); }, 100);
    });

我不确定为什么在超时后设置焦点应该有效。可能是因为圆角操作修改了DOM（他们在容器的顶部和底部添加了一系列DIV来创建圆角边框），这需要一些时间，并且focus()是在DOM完成之前发生的更新？

感谢您的帮助

埃德

【问题讨论】：

对于初学者来说，jQuery 圆角插件到现在已经有一年多了。 jQuery UI 的方式是使用浏览器检测和特定于浏览器的 CSS（如 -moz-border-radius）。然而，对于 IE，jQuery UI 完全省略了圆角，因为支持太差了。
你也可以考虑使用Formwin

标签： jquery internet-explorer-8 focus rounded-corners

【解决方案1】：

由于您正在执行超时并且它可以工作，是否可能是在文档准备好后加载了表单元素？ IE。用ajax加载还是用javascript创建？

我知道 JQuery 角落尝试在每个浏览器中使用 CSS3，但如果是 IE，它会生成一堆 div。难道是在IE6/7中它只需要更长的时间所以不需要超时>

【讨论】：