Question

我有一个php和SQL代码，用于将数据提取到datalist HTML input。

代码非常通用，应该向所有人了解：

<datalist id="FindPlace">
 <option hidden></option>
 <?php
   $sql = "SELECT IDPlace, Place_Name, FKCity FROM Places WHERE Place_Name <> '' ORDER BY Place_Name";

   $result = $conn->query($sql);
   if ($result->num_rows > 0) {
    while ($row = $result->fetch_assoc()) {
     echo "<option>" . $row["Place_Name"] . "</option>";
     }
    }
  ?>
</datalist>

我已尝试使用LIMIT，但它隐藏了其他所有结果，我需要将它们全部用到，只是在我点击input时没有显示所有结果比如前十个选项。

我还尝试在$counter和while之间的php代码中插入类似echo的内容，如下所示：

<?php
$sql = "SELECT IDPlace, Place_Name, FKCity FROM Places WHERE Place_Name <> '' 
ORDER BY Place_Name";
$counter = 10;

$result = $conn->query($sql);
if ($result->num_rows > 0) {
 while ($row = $result->fetch_assoc()) {
  if ($row < $counter) {
   echo "<option>" . $row["Place_Name"] . "</option>";
  }
  else {
   break;
  }
 }
}
?>

它没有用。我真的不知道如何使用JQuery，所以最好不要使用它，可能有一个我不知道的命令，或者一些技巧？

Answer 1

你可以用css解决这个问题。尝试类似下面的代码。这是相关的小提琴检查：click here

 
.wrapper option:nth-child(n+11){
  background-color: gold;
  display:none;
}

<div class="wrapper">
    
    <option>Container #1</option>
    <option>Container #2</option>
    <option>Container #3</option>
    <option>Container #4</option>
    <option>Container #5</option>
    <option>Container #6</option>
    <option>Container #7</option>
    <option>Container #8</option>
    <option>Container #9</option>
    <option>Container #10</option>
    <option>Container #11</option>
    <option>Container #12</option>
    
</div>

Answer 2

试试这个 -

$result = $conn->query($sql);
if ($result->num_rows > 0) {
    $i=0;
    while ($row = $result->fetch_assoc()) {
        $i++;
        if ($i<=10) {
            echo "<option>" . $row["Place_Name"] . "</option>";
        } else {
            break;
        }
    }
}

显示前10个结果，隐藏其余部分？

2 个答案: