jQuery的標籤失去CSS

Question

考慮：

<div id="tabs" > 
    <ul> 
     <li><a href="#Tab1">A</a></li> 
     <li><a href="#Tab2">B</a></li> 
     <li><a href="#Tab3">C</a></li> 
    </ul><br /> 

    <div id="Tab1" style="margin:0px; padding:0px;"> 
     <ul> 
      <li><a href="#InnerTab1">Inner A</a></li> 
      <li><a href="#InnerTab1">Inner B</a></li> 
      <li><a href="#InnerTab1">Inner C</a></li> 
     </ul> 
     <div id="InnerTab1">Welcome to Inner Tab1</div> 
     <div id="InnerTab2"><p>Welcome to Inner Tab1</p></div> 
     <div id="InnerTab3"><p>Welcome to Inner Tab1</p></div> 
    </div> 
    <div id="Tab2"><p>Tab2</p></div> 
    <div id="Tab3"><p>Tab3</p></div> 
</div> 

上面的代碼是在一個名爲ABC PartialView。

<%= Ajax.ActionLink("Select", "Action", new { Id = item.CustomerID }, new AjaxOptions { UpdateTargetId = "Abc" })%> 

而且上面的代碼在局部視圖中被命名爲XYZ。

所以，我有兩個部分的意見，ABC和XYZ。這兩個部分視圖在一個視圖上被調用。在XYZ視圖中，我有一個actionLink按鈕，點擊它可以在ABC中填寫詳細信息。

現在，在ABC我有一個標籤面板，如圖上面的代碼。第一次加載頁面時，我正確顯示了jQuery選項卡。當我點擊ActionLink按鈕時，選項卡以List的形式顯示。

我不知道什麼是happeneing。所以這是我的問題。爲什麼他們在點擊操作鏈接上丟失了CSS？

我已經囊括了所有在我的代碼jQuery的文件。

Answer 1

的jQuery UI標籤組件不只是CSS - 它也使用JavaScript代碼來修改下#tabs的元素。當您點擊鏈接時，ABC內的所有內容都會被服務器中的版本所取代，但不包含這些修改。

如果您在包含選項卡的元素上使用不顯眼的Ajax更新，則需要向AjaxOptions添加一個OnComplete處理程序，以便在更新HTML後重新調用$("#tabs").tabs()來重做這些修改。