一尘不染

Webkit中的AutoCompleteExtender位置错误

ajax

我有一个ajaxtoolkit
AutoCompleteExtender,它的位置是:绝对。我将其放置在div内,位置为:relative。这样一来,扩展程序下拉菜单就可以完美地在所有浏览器上放置,但Chrome
/ Safari除外,在Chrome / Safari上,该位置相对于窗口的左上角而不是div。

当我放置另一个具有与AutoCompleteExtender生成的HTML相同的CSS类和内联样式的ul时,在Chrome中定位正常。因此,扩展程序有一些特定的功能,使其可以在HTML代码的底部(在end标记之前)呈现,因此在计算位置时不将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;
}

阅读 213

收藏
2020-07-26

共1个答案

一尘不染

尝试<div>在具有spcified id属性的扩展程序之后立即添加纯HTML
元素,并将此id值用于扩展程序的CompletionListElementID属性。

当您将传递id给扩展程序时,它将项目插入为<div>元素。因此,添加纯HTML <div>而不是HTML 可以<ul>维护有效的HTML。

2020-07-26