Ajax組合框列表右移在Jquery標籤下

我一直在我的項目中使用相同的Ajax組合框，但是當我在jQuery選項卡控件下使用Ajax組合框時，列表向右移動，UI顯得模糊。我不想從ajax轉移到jquery組合框和自動完成，因爲我只是想要解決這個問題。下面是我的代碼：Ajax組合框列表右移在Jquery標籤下

<ajax:ComboBox ID="LenCompDpd" runat="server" Width="133px" CssClass="AquaStyle  textfont" 
OnSelectedIndexChanged="LenCompDpd_SelectedIndexChanged" AutoPostBack="true" 
            DropDownStyle="DropDown" AutoCompleteMode="SuggestAppend" CaseSensitive="false" 
            ItemInsertLocation="OrdinalText" />

來源

2012-10-11 Iti Tyagi

這是因爲jQuery的UI的CSS設置與阿賈克斯組合框的CSS設置弄亂，這裏是一個簡單的例子，我必須設置樣式的組合框頁面中調整的jQuery的CSS，使它看起來正常：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Tabs.aspx.cs" Inherits="WebApplication1.Tabs" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.0/themes/base/jquery-ui.css" />  
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>  
    <script type="text/javascript" src="http://code.jquery.com/ui/1.9.0/jquery-ui.js"></script> 
    <script type="text/javascript">   
     $(function() { $("#tabs").tabs(); });  
    </script> 
    <style type="text/css"> 
     .ajax__combobox_itemlist 
     { 
      left: 28px !important;    
      top: 103px !important; 
     } 
    </style> 
</head> 
<body> 
    <form id="form1" runat="server"> 
     <asp:ScriptManager ID="ScriptManager1" runat="server"> 
     </asp:ScriptManager> 
     <div id="tabs">  
      <ul>   
       <li><a href="#tabs-1">Nunc tincidunt</a></li>   
       <li><a href="#tabs-2">Proin dolor</a></li> 
      </ul>  
      <div id="tabs-1"> 
        <ajaxToolkit:ComboBox ID="ComboBox1" runat="server" 
         AutoPostBack="False" 
         DropDownStyle="DropDownList"> 
         <asp:ListItem Text="One"></asp:ListItem> 
         <asp:ListItem Text="Two" /> 
         <asp:ListItem Text="Three" /> 
        </ajaxToolkit:ComboBox> 
      </div>  
      <div id="tabs-2">   

      </div>  
     </div> 
    </form> 
</body> 
</html>

訣竅是使用CSS類組合框，就像.ajax__combobox_itemlist調整樣式，以便將其與jQuery的東西的作品。

來源

2012-10-11 15:38:46

Ajax組合框列表右移在Jquery標籤下

回答

相關問題