我是jquery的新手,正在尝试使用UI插件。出于某种原因,以下代码不起作用,从某种意义上说,它不会呈现选项卡,而只是一堆文本。但是当我复制页面源并将其粘贴到html页面中并将其放在views文件夹中时,一切看起来都很棒,所以,我认为所有的js路径都很好。有什么想法吗?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Details</title>
<link href="../../Scripts/themes/base/ui.all.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/jquery-1.3.2.js" type="text/javascript"></script>
<script src="../../Scripts/ui/ui.core.js" type="text/javascript"></script>
<script src="../../Scripts/ui/ui.tabs.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#tabs").tabs();
});
</script>
</head>
<body>
<div>
<div id="tabs">
<ul>
<li><a href="#tabs-1">Text 1</a></li>
<li><a href="#tabs-2">Text 2</a></li>
<li><a href="#tabs-3">Text 3</a></li>
</ul>
<div id="tabs-1">
<div>tab1 content - adsfadfadsf</div>
</div>
<div id="tabs-2">
<div>tab 2 content -adfadfadf </div>
</div>
<div id="tabs-3">
<div>tab 3 content -adfadfadfadf</div>
</div>
</div>
</div>
</body>
</html>
答案 0 :(得分:2)
首先始终是相对路径的“〜/”表示法,这将避免在部署到虚拟文件夹时出现问题。 您也可以自己编写一个帮助程序来封装它:
<script src="<%= Url.Content("~/Scripts/script.js") %>"></script>
你在MvcContrib中有很好的助手,比如
Html.Script("~/Script/js-debug.js", "~/Script/js-prod.js");
你的css会出现同样的问题:
Html.Css("~/Content/style.css");
我在我的最新项目中使用它并且我在那里看不到编程错误,所以我认为在脚本路径中你有效地存在问题。
此外,使用Firebug非常容易并检查你得到的js错误,如果脚本全部加载等等......
最后,最好将所有js代码放在html页面的末尾(就在标记之后。这不是必需的,但有助于加快页面加载,因为脚本将在页面被解析后下载)浏览器。
答案 1 :(得分:1)
除了这些脚本文件的路径之外,我看不到您的代码有什么问题。在ASP.NET MVC视图中,在使用url时使用html帮助是一个好习惯:
<script src="<%= Url.Content("~/Scripts/jquery-1.3.2.js") %>"></script>
答案 2 :(得分:0)
所以我假设所有的js路径都很好
你的假设大多是错误的。如果/ Action被渲染并使用/Views/Action/Index.aspx视图,则动作的相对路径与您直接显示/Views/Action/Index.html时的路径不同。
所以请使用类似
的内容<script src="<%= Url.Content("~/Content/js/jquery-1.2.3.min.js") %>" type="text/javascript"></script>