【问题标题】:jQuery UI not working? (Specifically tabs)jQuery UI 不工作? (特别是标签)
【发布时间】:2011-11-18 23:17:45
【问题描述】:

奇怪的问题。我看过一些类似的问题——他们的答案都没有解决我的问题。

它做的所有事情都是正确的,但选项卡并没有像它们预期的那样变得交互,而是全部显示。

我将尽可能多地省略不必要的代码,包括我的装饰性 CSS。

请随时向我询问更多信息。感谢观看。

这是我的头文件:

<link rel="stylesheet" type="text/css" href="/Include/styleSheetV2.css"/>
<link rel="stylesheet" type="text/css" href="/Include/StyleSheet.CSS"/>
<link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet"/>
<script type="text/javascript" src="https://www.google.com/jsapi?key=(Removed key for StackOverflow)"></script>

<script type="text/javascript" src="/JSFunctions.js"></script>
<script type="text/javascript">
google.load("jquery", "1.6.4");
google.load("jqueryui", "1.8.16");
</script>

这是 HTML 代码

<div id="prof_div" class="sG_tabber">
    <ul class="sG_tabberNav">
        <li><a href="#prof_home">Profile Home</a></li>
        <li><a href="#prof_details">Details</a></li>
        <li><a href="#prof_settings">Settings</a></li>
    </ul>
    <div id="prof_home" class="sG_tabberTab">
        1   
    </div>
    <div id="prof_details" class="sG_tabberTab">
        2
    </div>
    <div id="prof_settings" class="sG_tabberTab">
        3
    </div>
</div>
<script type="text/javascript">
    $(document).ready(function() {  
        $('#prof_div > ul').tabs({ 
            fx: { height: 'toggle', opacity: 'toggle' } 
        });
    }); 
</script>

这是我的 CSS 代码(只有必要的部分)

.ui-tabs-hide {  
    display: none;
}

【问题讨论】:

    标签: javascript jquery html jquery-ui google-cdn


    【解决方案1】:

    尝试使用$("#prof_div").tabs() 而不是#prof_div &gt; ul

    【讨论】:

    • 工作。 10 分钟结束后,我会在你的答案上打勾。感谢您的快速响应:)
    • 是的,jQuery ui 锁定的原因通常很简单——有时可能有点复杂。只需确保仔细检查示例。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-01-25
    • 2014-07-20
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多