Le chargement du fichier Chosen.jquery.js dans le fichier html ne fonctionne pas - javascript, jquery, html, css, choisi par jquery

J'essaie de charger le fichier Choisi.jquery.js dans mon fichier html / css pour obtenir une liste de recherche consultable, mais cela ne semble pas fonctionner. J'ai téléchargé le plugin selected.js depuis http://harvesthq.github.io/chosen/. Après avoir téléchargé le plugin, j'ai copié les fichiers choisis (js et css) dans le dossier / includes de mon outil.

C'est ce que j'ai essayé jusqu'à présent:

<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>";
}
?>

Dans la case de sélection, j'ai "choisi-sélection". À plusieurs endroits, la classe a été déclarée comme étant seulement "choisie" ou "chzn-select". Lequel est le bon? De plus, je ne sais pas à quoi servent les fichiers .min?

Qu'est-ce qui me manque ici?

Merci d'avance.

Réponses:

1 pour la réponse № 1

Vous avez dupliqué les CSS et min.css. Egalement les versions jquery et jquery.min.

Min signifie minified - compressé pour la rapidité de servir fondamentalement.

Vous semblez également utiliser jQuery etLes versions prototypes de choisi. Utilisez-vous la bibliothèque Prototype JS ailleurs? Si ce n’est pas le cas, je le supprimerais et utiliserais (une version) de Choisi pour JQuery. Vous devriez également vous assurer que vous incluez jQuery lui-même ... est-ce ailleurs dans votre code?

Sur cette base, vous aurez besoin de:

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

Ou si vous n’avez pas déjà inclus jQuery - téléchargez-le à partir de:

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

et aussi le stocker dans votre dossier includes. Ajoutez-le au-dessus des fichiers choisis avec:

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

Une fois que vous avez supprimé ces fichiers supplémentaires, cela devrait être aussi simple que:

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

Dans un appel jQuery .ready () existant ou nouveau [à exécuter dès que le DOM est prêt]

Et en vous assurant que vous avez class = "selected-select" sur chaque champ de sélection sur lequel vous souhaitez utiliser le choix.

METTRE À JOUR:

Essayez d'ajouter ceci pour lancer Choisi:

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

Cela peut aller dans la section de votre page HTML ou juste avant la balise de fermeture. Devrait travailler dans l'un ou l'autre - juste avant la fermeture serait mon choix.

---