【发布时间】:2009-01-22 08:42:21
【问题描述】:
我正在使用 jQuery 为 Web 应用程序创建大量选项卡。到目前为止,我只使用了基本示例provided from here,但没有任何运气。选项卡内容有效,主题显示正确,但是当我单击选项卡时,选项卡的状态没有改变。这个应用程序必须在 IE7 下运行,任何其他浏览器都无所谓(我可以补充一下,我不是 IE7 用户,我是狂热的 Firefox 用户)
<div class="ui-tabs ui-widget ui-widget-content ui-corner-all" id="tabs">
<ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
<li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active"><a href="#tabs-1"><span>Nunc tincidunt</span></a></li>
<li class="ui-state-default ui-corner-top"><a href="#tabs-2"><span>Proin dolor</span></a></li>
</ul>
<div class="ui-tabs-panel ui-widget-content ui-corner-bottom" id="tabs-1">
<p>Tab one content goes here.</p>
</div>
<div class="ui-tabs-panel ui-widget-content ui-corner-bottom" id="tabs-2">
<p>Tab1 one content goes here.</p>
</div>
以下是 jQuery's ThemeRoller 提供的 CSS,因此我的包含如下所示:
<link href="/intranet/common/stylesheets/jquery-ui/ui.all.css" rel="stylesheet" type="text/css" />
<script src="/intranet/common/javascript/jquery-1.2.6.min.js" type="text/javascript"></script>
<script src="/intranet/common/javascript/jquery-ui.js" type="text/javascript"></script>
然后我使用以下命令启用标签:
<script type="text/javascript">
$(document).ready(function() {
$("#tabs > ul").tabs();
});
</script>
正如我所说,选项卡内容有效,所有内容都是主题,但是一旦我“单击”选项卡,选项卡的状态就不会变为活动状态。 ThemeRoller 在 IE7 中工作,但我的页面没有。我不知道我哪里出错了,我已经玩了几个小时至少试图让它工作。
有什么想法吗?
【问题讨论】:
标签: jquery-ui