4

我有一个具有位置的 ajaxtoolkit AutoCompleteExtender：绝对。我把它放在一个 div 中，位置为：relative。这使得扩展器下拉菜单完美地放置在所有浏览器上，除了 Chrome/Safari，其位置相对于窗口的左上角而不是 div。

当我放置另一个具有与为 AutoCompleteExtender 生成的 HTML 相同的 css 类和内联样式的 ul 时，定位在 Chrome 中工作正常。所以扩展器有一些特定的东西使它呈现在 HTML 代码的底部（就在结束标记之前，因此在计算它的位置时不使用 div 作为它的父级。

有什么想法可以解决这个问题吗？

代码：

<div class="searching">
<ajaxToolkit:AutoCompleteExtender 
            runat="server" 
            ID="biznameOrCategoryAutoComplete" 
            TargetControlID="txtBizNameOrCategory"
            ServicePath="~/AutoComplete.asmx"
            ServiceMethod="GetBiznameOrCategoryCompletionList"
            MinimumPrefixLength="1" 
            CompletionInterval="1000"
            EnableCaching="true"
            CompletionSetCount="10" 
            CompletionListCssClass="autocomplete_completionCompyNameListElement" 
            CompletionListItemCssClass="autocomplete_listItem" 
            CompletionListHighlightedItemCssClass="autocomplete_highlightedListItem"
            ShowOnlyCurrentWordInCompletionListItem="true">
        </ajaxToolkit:AutoCompleteExtender>
</div>

CSS：

.searching {
margin-left:5px;
padding-top:10px;
width:366px;
position: relative;
}
.autocomplete_completionCompyNameListElement {
background: #fff;
font-family:Arial, Helvetica, sans-serif;
font-size: 17px;
width: 340px !important;
left: 20px !important;
border: 1px solid #d9d9d9;
font-size: 12px;
top: 48px !important;
padding: 2px 4px !important;
}
4

1 回答 1

6

Try to add plain HTML <div> element right after extender with spcified id attribute and use this id value for extender's CompletionListElementID property.

When you pass an id to the extender it will insert the items as <div> elements. So adding a plain HTML <div> rather than a <ul> maintains valid HTML.

于 2011-12-01T09:28:12.740 回答