javascript - jquery Tab 仅在同一页面中本地引用脚本时有效

Question

我正在尝试在 mvc4 应用程序中使用 jquery UI 选项卡。在bundleconfig中添加并在layout.cshtml页面中引用的所有必要的脚本和样式。

请引用下面的代码。

<div id="tabs">     
<ul>
    <li><a href="#tabs-1">Table</a></li>
    <li><a href="#tabs-2">Heat</a></li>       
</ul>

<div id="tabs-1">
 content fo tab1
</div>     
<div id="tabs-2">
Content for Tab2
</div>  
</div>

<script type="text/javascript">    
    $(function () { 
        $("#tabs").tabs();
    });    
</script>

所需脚本已在layout.cshtml中引用。但选项卡仍然无法正常工作。然后我尝试将其添加到本地相同的 .cshtml 页面中。

<link rel="stylesheet" href="@Url.Content("~/Content/jquery-ui-1.9.0.css")" />
<script src="@Url.Content("~/Scripts/jquery-1.8.3.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.9.0.min.js")" type="text/javascript"></script>

然后它工作正常，但它加载了 jquery 和 UI 脚本两次

我不知 Prop 体的问题是什么。

Answer 1

嘿，尝试如下操作并从 .cshtml 页面中删除添加的 jquery lib 文件。

 $(document).ready(function(){
    $("#tabs").tabs();
 });