javascript - 用于实时搜索的 EasyAutocomplete jquery 插件，下拉建议框与周围的输入字段重叠

Question

当我搜索时出现问题，然后它的下拉建议在输入字段下方重叠。location

主页.php

<form>  
     <label for="contact-name">Contact Name:</label>
     <input type="text"/>
     <label for="contact-no">Contact No:</label>
     <input type="number"/>
     <label for="place">Location:</label>
     <!--problem area from here-->.
     <input type="text" id="locate"name="location" />
     <script src="live_search.js"></script>
     <label for="size">Size:</label>
     <input type="text" />
     <label for="price">Price:</label>
     <input type="number" />
     <label for="rent">Rent/Monthly:</label>
     <input type="number"/>
     <button type="submit" name="submit-data">Submit</button>
</form>

此脚本触发搜索框的自动完成功能并显示来自 jason 文件的建议，当它这样做时，它会在出现问题的位置的输入框下方生成一个下拉列表。

live_search.js

var options = {
    url: "location.json",//goto location.json

    getValue: "location",//get the value of the object with name=location

    list: {
        match: {
            enabled: true
        }
    }
};

$("#locate").easyAutocomplete(options);  

位置.json

[
{"location":"wapda town"},
{"location":"gulberg"},
{"location":"valencia"},
{"location":"gulshan e iqbal"},
{"location":"iqbal avenue"},
{"location":"architect society"},
{"location":"garden town"},
{"location":"defence"},
{"location":"Faisal Garden"},
{"location":"Faisal Town"},
{"location":"Faisalabad"}
]