在HTML文件中加載Chosen.jquery.js文件不起作用

Question

我試圖在我的html / css文件中加載selected.jquery.js文件，以實現可搜索的下拉菜單，但它似乎不起作用。 我從http://harvesthq.github.io/chosen/下載了selected.js插件。 下載插件后，我將選擇的文件（js和css）復制到工具的/ includes文件夾中。

這是我到目前為止嘗試過的：

<script src="../includes/chosen.jquery.js"></script>
<script src="../includes/chosen.jquery.min.js"></script>
<script src="../includes/chosen.proto.js"></script>
<link rel="stylesheet" href="../includes/chosen.css" />
<link rel="stylesheet" href="../includes/chosen.min.css" />

<div class="searchform">

        <form class="pure-form" action="searchresults.php" method="post">
            <fieldset>
        <div class="searchfilters">
                <label>Search Filters: </label>
          <div class="search_boxes">                
         <select class="chosen-select" style="width:350px;" onchange="this.form.submit()">

                        <!--<option selected="selected">Search Project/Initiative...</option>-->
                        <?php
                                include "../includes/search_dropdown.php";
                                foreach($proj_ini_Array as $qa){
                                echo "<option value = \"$qa\">$qa</option>";
                                }
                        ?>   

在選擇框中，我選擇了“選擇”。 在多個地方，該類僅被聲明為“選擇”或“ chzn選擇”。 哪一個合適？ 另外，我不確定.min文件有什么用？

我在這里想念什么？

提前致謝。

Answer 1

您已經復制了CSS和min.css。 也是jquery和jquery.min版本。

最小代表最小-壓縮基本上代表服務速度。

您似乎還同時使用了jQuery和Prototype版本。 您是否在其他地方使用Prototype JS庫？ 如果沒有，我將其刪除，僅將選擇的（一個版本）用於JQuery。 您還應該確保自己包括jQuery本身...代碼中的其他地方嗎？

在此基礎上，您需要：

<script src="../includes/chosen.jquery.min.js"></script>
<link rel="stylesheet" href="../includes/chosen.min.css" />

或者，如果您尚未包括jQuery，請從以下位置下載：

http://code.jquery.com/jquery-1.10.2.min.js

並將其存儲到您的include文件夾中。 使用以下命令將其添加到選擇的文件上方：

<script src="../includes/jquery-1.10.2.min.js"></script>

清除掉多余的文件后，它應該很簡單：

$('.chosen-select').chosen();

在現有或新的jQuery .ready（）調用內[在DOM准備好后立即運行]

並確保在要使用“選擇”的每個選擇字段上具有class =“ chosen-select”。

更新：

嘗試添加以下內容以啟動選擇：

<script>
$(document).ready(function() {
   $('.chosen-select').chosen();
});
</script>

可以在HTML頁面的部分中，也可以在結束標記之前。 應該在這兩種情況下都可以工作-在結賬之前是我的選擇。