[英]Stuck using jQuery UI Tabs
I've got hree html tables which I wanted to put into tabs. 我有三个要放在标签中的HTML表格。
All three tables can be loaded using AJAX
but i want to show the first table and ALSO allow the first table to be ajaxable. 可以使用AJAX
加载所有三个表,但我想显示第一个表,并且还允许第一个表可被ajaxable。
Lastly, I need to have the option for the user to SEARCH in the 3rd tab and those results (html result) goes into that tab. 最后,我需要在第3个选项卡中为用户提供搜索选项,并将这些结果(html结果)放入该选项卡。
The problem is: When I run my current code, it's not allowing me to click the tabs (it shows some uglyish style in FireFox) and the 3rd tab is only shown. 问题是:当我运行当前代码时,它不允许我单击选项卡(在FireFox中显示为难看的样式),并且仅显示第3个选项卡。
this is the before. 这是以前。
<h2>Title 1</h2>
<table>....data_A....</table>
<br/><br/>
<h2>Title 2</h2>
<table>....data_A....</table>
<br/><br/>
<h2>Title 3 - Search</h2>
<input id="name" type="textbox" />
<input id="search" type="submit" value="Search" />
<br/><br/>
and this is my jQuery attempt code. 这是我的jQuery尝试代码。
<asp:Content ContentPlaceHolderID="JavaScriptContent" runat="server">
<link type="text/css" href="../../Content/smoothness/jquery-ui-1.7.1.custom.css" rel="Stylesheet" />
<script src="/Scripts/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery-ui-1.7.1.custom.min.js" type="text/javascript"></script>
<SCRIPT type=text/javascript>
$(function() {
$("#tabs").tabs();
});
</SCRIPT>
</asp:Content>
<asp:Content ID="indexContent" ContentPlaceHolderID="MainContent" runat="server">
<div id="tabs">
<ul>
<li href="ajax/data_a">Title 1</li>
<li href="ajax/data_b">Title 2</li>
<li href="#tab-3">Search</li>
</ul>
<div id="tab-1">
.... data_A table is put here ...
.... but will be updated via ajax when the tabs is clicked.
</div>
<div id="tab-3">
<input id="name" type="textbox" />
<input id="search" type="submit" value="Search" />
</div>
</div>
</asp:Content>
can anyone help me? 谁能帮我? what have i done wrong? 我做错了什么?
cheer :) 欢呼:)
You have to have an a
tag inside the li
's. li
的内部必须有a
标签。 li
's don't have the href
attribute. li
没有href
属性。
<li><a href="ajax/data_a">Title 1</a></li>
<li><a href="ajax/data_b">Title 2</a></li>
<li><a href="#tab-3">Search</a></li>
Just at the source here: http://stilbuero.de/jquery/tabs_3/ 只是在这里的来源: http : //stilbuero.de/jquery/tabs_3/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.