javascript - 使用 Chosen 插件将 html 下拉列表修改为可搜索下拉列表

Question

我有一个可用的下拉列表，它从 PHP 中的 MySQL 数据库获取其值。

我想要一个可搜索的下拉列表，而不是使用选择的插件滚动列表。

现在，我的问题是如何将常规下拉列表更改为选择的下拉列表？ (我需要知道程序)

这是我的代码:

 <form> 
    <select name="mySubmit" onChange="drawChart(this.value);">
    <option value="">Select an option:</option>
 <?php


 // Make a MySQL Connection
 $con = mysql_connect($dbserver, $dbuser, $dbpass) or die(mysql_error());
 mysql_select_db($dbname) or die(mysql_error());

 // Create a Query
 $sql_query = "SELECT `Name`, `id` 
            FROM info AS t1
            where
               (SELECT COUNT(*)
                from info AS t2
                where t2.Name = t1.Name AND (t2.`Date`) > (t1.`Date`)) = 0";

 // Execute query
 $result = mysql_query($sql_query) or die($sql_query."<br/><br/>".mysql_error());
 while ($row = mysql_fetch_array($result)){
 echo '<option value='. $row['id'] . '>'. $row['Name'] . '</option>';
 }
 mysql_close($con);
 ?>
 </select>
 </form>

提前谢谢您。

Answer 1

首先，您必须为您选择的 HTML 元素提供一个类或 ID。

<select class="chosen" .... //same html/php code

然后在您的 javascript 代码中，调用 jQuery 选择插件将此选择更改为选择的元素，如下所示:

$(document).ready(function(){
    $('.chosen').chosen();
})

它应该可以工作，您不必更改 php 代码中的任何内容，只需为您的 select 元素提供一个类或 id 即可，这样您就可以使用 jQuery 选择器获取 if 。我建议您阅读所选文档