ASP.NET MVC下的JQuery菜单插件似乎只能在Chrome中工作,但不能在IE和FireFox中工作

标签 jquery asp.net asp.net-mvc plugins menu

最近,我尝试将一些基于 jQuery 的菜单原型(prototype)化到 ASP.NET MVC 中。这里仅举两个例子:

  1. plugins.jquery.com/project/columnview

  2. www.filamentgroup.com/lab/jquery_ipod_style_and_flyout_menus/

他们的演示页面看起来很棒,但是当我将他们的示例代码集成到 MVC 中时,该脚本不再在 IE 和 FireFox 中工作,但在 Google Chrome 下似乎工作得很好。有人可以指出我错过了什么吗?我在这里说实话。我对 JavaScript 还很陌生,所以对我来说仍然是一个学习阶段,因此非常感谢任何帮助。

我已经放置了 VS2010 解决方案 zip 文件的副本 @ http://db.tt/0UNDkN

这就是我所做的。 在 Site.Master 中,我有类似的内容

<body>
<div class="page">{truncated...}</div>

<script src="http://code.jquery.com/jquery-1.4.2.min.js" type="text/javascript" charset="utf-8"></script>
<asp:ContentPlaceHolder ID="ScriptContent" runat="server" />
</body>

在 View 文件中,我有以下内容

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<div id="original">
{some demo block, copied from javascript demo}
</div>
</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="ScriptContent" runat="server">
<script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery.columnview.js") %>" />
<script type="text/javascript">
    $(document).ready(function () {
        $('#original').columnview();
    });
</script>
</asp:Content>

编译代码并在IE下运行。理想情况下,它应该像 www.christianyates.com/blog/jquery/finder-column-view-hierarchical-lists-jquery 中的演示一样工作,但实际上,它只在普通 View 中显示无序列表。 (如果您下载解决方案文件并运行它,您也应该能够重现这一点)。接下来,尝试使用FireFox,也不起作用,结果与IE相同。最后,当我在 Google Chrome 4.1(最新版本)下尝试时,脚本显示得很好。这里真的令人费解:-/

感谢您的阅读:D

最佳答案

史诗般的失败.. 原来这和XHTML验证有关

ASP.Net MVC 默认有以下 DocType

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

在原始代码中,我有

<script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery.columnview.js") %>" />

事实证明 IE 和 FireFox 不喜欢结束标记。它更喜欢

<script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery.columnview.js") %>"></script> 

结束标签</script>是这个原因。

关于ASP.NET MVC下的JQuery菜单插件似乎只能在Chrome中工作,但不能在IE和FireFox中工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2796336/

相关文章:

jquery - 在滚动期间同时触发一个动画

javascript - 如何在类的最后一个元素上设置实时点击功能?

c# - 对绑定(bind)到 linq SP 的 gridview 进行排序

javascript - 当我需要呈现 HTML 和 "simple text" View 时,在我的数据库中存储支持 Markdown 的字段的最佳方法是什么?

c# - 为什么我的 MVC 应用程序中的日期格式错误?

asp.net-mvc - 如何在正则表达式中忽略大小写?

javascript - 添加 "modal div"时更改背景颜色和透明度

jquery - 验证失败的 htm 属性后返回编辑 View

c# - 在 Global.asax 的 Application_Start 方法中访问缓存时出错

html - asp.CheckBox 渲染显示在跨度内。样式属性以跨度结束,而不是复选框