Question

我有一个自动填充字段，当您键入区域或县时，它会自动填充数据库中的数据。所有这一切都很完美，但是当你开始输入主要内容div后面显示建议的方框时。

您可以通过转到此处查看此示例 http://dev.exclusivecard.co.uk

如果曾经在那里输入＆＃34; Merseyside＆＃34;在页面顶部搜索按钮左侧的字段中，您将看到一个框，但它出现在主要内容的后面。我可以在这里找到使用的代码 http://phppot.com/demo/jquery-ajax-autocomplete-country-example/

我的CSS看起来如下......

 #list-box{ position:absolute;}
 #country-list{position:relative; float:left;list-style:none;margin:0;padding:0;width:190px; color:#262626;}
 #country-list li{padding: 10px; background:#FAFAFA;border-bottom:#F0F0F0 1px solid;}
  #country-list li:hover{background:#F0F0F0;}
  #demo-content table.tutorial-table {table-layout:auto;}

和页面

<div id="demo-content">
    <div class="frmSearch">
        <input class="form-control" name="search-box" id="search-box"  type="text" placeholder="<?php if(isset($_COOKIE['localArea'])){ echo $_COOKIE['localArea'];}?>" />
        <div id="list-box"></div>
    </div>
</div>

Answer 1

按照您需要的顺序播放CSS z-index属性顺序给它的每个元素。

Answer 2

如果#list-box是父div，那么你只需要给它一个大的z-index。

 #list-box{ position:absolute; z-index:9999}

div在表单中显示其他内容

2 个答案: