表格佈局中的Jquery選項卡

我想要「選項卡」的部分位於嵌套表格佈局中。表格佈局中的Jquery選項卡

它開始像這樣的表爛攤子後：

<table> <tr> <td> <table> <tr> <td> <table> <tr> <td> 
     <div id ="SearchModuleContainer"> 
     <ul class="tabNavigation"> 
      <li><a href="#PersonSearchPanel"></a></li> 
      <li><a href="#TypeSearchPanel"></a></li> 
     </ul> 

     <div id="PersonSearchPanel" runat="server"> 
     <table width="100%" border="0" cellspacing="0"> 
      <tr> 
      <td align="center" valign="top"> 
       <table width="100%" border="0" cellpadding="0" cellspacing="0"> 
        <tr> 
      ... 
      ... 
     </div> 
     <div id="TypeSearchPanel" runat="server"> 
     <table width="100%" border="0" cellspacing="0"> 
      <tr> 
      <td align="center" valign="top"> 
       <table width="100%" border="0" cellpadding="0" cellspacing="0"> 
        <tr> 
      ... 
      ... 
     </div> 
    </div>

我添加了一個裁判的jQuery-UI-1.7.1，並在我的js文件，我有：

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

我的問題是，我錯過了什麼，或者在像這樣的「老派」混亂的表格佈局中使用jquery時是否存在一些問題？

來源

2009-06-16 Soeren

您是否還添加了對jQuery核心庫的引用？ – 2009-06-16 10:19:06

在這個鏈接你有一個很好的例子 http://www.remotesynthesis.com/post.cfm/adding-and-removing-tabs-with-jquery-and-jquery-ui – 2009-06-16 10:31:04

您需要確保您的css正確實施了ui-tabs-hide，ui-tabs-類。如果你沒有做到這一點，它會看起來像腳本不起作用。最簡單的方法來檢查它添加以下內容：

<link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7/themes/smoothness/jquery-ui.css" />

只是在你的HTML頁面的頭部之前，你的JavaScript文件添加此。我測試了您的示例，並且選項卡功能與表格一起使用。

[編輯]我粘貼了我的測試示例here的源代碼。

來源

2009-06-16 11:46:42

表格佈局中的Jquery選項卡

回答

相關問題