Застрял с помощью вкладок пользовательского интерфейса jQuery

Question

У меня есть html-таблицы, которые я хотел бы вставить в вкладки.

Все три таблицы могут быть загружены с использованием AJAX, но я хочу показать первую таблицу и ТАКЖЕ позволить первой таблице быть ajaxable.

Наконец, мне нужно иметь возможность для пользователя ПОИСК на третьей вкладке, и эти результаты (результат html) попадают на эту вкладку.

Проблема заключается в следующем: когда я запускаю свой текущий код, это не позволяет мне щелкнуть вкладки (это показывает какой-то уродливый стиль в FireFox), и показана только 3-я вкладка.

это прежде.

<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/> 

и это мой код попытки 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> 

Может мне кто-нибудь помочь? что я сделал не так?

развеселить :)

Answer 1

Вы должны иметь a тег внутри li «с. 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> 

Просто у источника здесь: http://stilbuero.de/jquery/tabs_3/