MVC3：IE8 因在列表中使用 JqueryUI 而崩溃答案

【问题标题】：MVC3: IE8 crashing from use of JqueryUI in a listMVC3：IE8 因在列表中使用 JqueryUI 而崩溃
【发布时间】：2011-07-03 18:44:05
【问题描述】：

我正在使用 VS2010+MVC3(Razor)+IE8+JQueryUI 堆栈，并尝试使用 jqueryui .buttons() 函数创建按钮列表。但是，由于某些未知原因，当按下按钮时，它会始终使 Dev-Webserver+IE8 崩溃。下面的代码对于演示该错误是必要且足够的。只需将其剪切并粘贴到您的 Home/Index.chtml 文件中并运行。

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/themes/base/jquery-ui.css" type="text/css" media="all" /> 
<link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css" type="text/css" media="all" /> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/jquery-ui.min.js" type="text/javascript"></script> 

<ul>
    <li>
        <div>
            <label for="aa">text</label>
            <input type="checkbox" id="aa" class="theclass"/>
        </div>
    </li>
</ul>
<script type="text/javascript">
                            $(function () {
                                $(".theclass").button();
                            });
</script>

这适用于 Chrome，如果将其放入纯 HTML 文件并在 VS2010 之外运行，也不会发生错误，因此这可能是 MVC/ASP 特有的。删除周围的 div 将阻止它崩溃。值得注意的是，这只在按钮是 div 组中的最后一个按钮时才会崩溃。作为 hack，我在输入元素之后添加了一个空 div，这阻止了它崩溃。这是一个非常特殊的错误，因此我将其发布在这里，以防有人遇到类似的麻烦。

干杯抢

【问题讨论】：

标签： list asp.net-mvc-3 checkbox razor jquery-ui-plugins

【解决方案1】：

IE8 有一大堆错误。最好的建议是查看这个 IE8 错误列表。每当我发现 IE8 错误时，我都会使用此列表。

http://jhop.me/ie8-bugs

我可以在该页面上找到的最接近的内容是以下 javascript 错误。

在跳出 for 循环的语句中使用 querySelectorAll 会触发整个程序崩溃。

这可能是 jQuery 方法导致的，或者是按钮方法导致的。你为什么要把一个复选框变成一个按钮？我不认为按钮方法应该那样工作。

【讨论】：

【解决方案2】：

这也发生在我身上，但不是在 VS2010 中，也不是在 MVC 中，这似乎只是 jQueryUI 按钮发生的事情......

我的解决方案很简单，将违规元素包装在 SPAN 标记中。在上面的示例中，这应该可以解决问题...

<span class="theclass"><input type="checkbox" id="aa"></span>

【讨论】：