填充数据列表花费的时间太长。 用户在输入字段中输入几个字母后如何开始填充

Question

我有一个包含世界各城市的数据库表。 总共有超过100 000个条目。 用户应通过输入文本字段和数据列表选择这些条目之一。 现在，我通过PHP填充数据列表选项：

<input type='text' list='location' placeholder='Location'>
<datalist id='location'>
    <?php include("query.php");
        while($row = $result->fetch_assoc()) {
            echo "<option data-value='". $row['CityName']. "'>". $row['CityName']. "</option>";
    };?>
</datalist>

但是，由于行数很大，因此加载这些选项花费的时间太长。 因此，仅当用户在输入字段中输入至少3个字母时（如在本网站上 ），我才想开始填充过程。 但是我现在的问题是我不知道如何结合javascript if子句和php代码，因为在我可以使用javascript之前已加载了php。 我如何像提到的网站一样创建此功能？

Answer 1

我认为JQuery自动完成功能是一个完整的答案。 特别是在“远程数据源”情况下。