Come si usa jQuery scelto nel mio file html?

Come si applica Chosen jQuery nella mia pagina html?Come si usa jQuery scelto nel mio file html?

Ho un modulo select così ho bisogno di usare il multiple select di Chosen per renderlo più user friendly.

<select class="chosen" multiple="true" name="faculty"> 
     <option value="AC">A</option> 
     <option value="AD">B</option> 
     <option value="AM">C</option> 
     <option value="AP">D</option> 
</select>

Ho scaricato il file e copiato nella mia cartella di pagina web.

Allora, che cosa ho fatto è stato includere il chosen.jquery.min.js in <head>:

<script type="text/javascript" src="chosen/chosen.jquery.min.js"></script>

e l'istruzione dice Per lanciare il plugin scelto: $(".chzn-select").chosen();

non so dove mettere questa affermazione JavaScript ordine di invocare selezioni multiple scelte. Ho pensato che fosse facile come usare Bootstrap, hah. Qualsiasi aiuto?

fonte

2012-12-18 AimanB

se hai inserito il file nella tua pagina, si deve solo essere semplice come creare

tuo select deve avere la classe chzn-select, e normalmente si dovrebbe eseguire uno script dopo caricamento della pagina come la seguente:

$(function() { 
    $(".chzn-select").chosen(); 
});

seguito è riportato un collaudato, esempio di lavoro:

<html> 
<head> 
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css"> 
<script src="http://code.jquery.com/jquery-1.8.3.js"></script> 
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.4.2/chosen.jquery.js"></script> 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.4.2/chosen.css"> 
</head> 
<body> 

<script type="text/javascript"> 
$(function() { 
    $(".chzn-select").chosen(); 
}); 
</script> 

<select class="chzn-select" multiple="true" name="faculty" style="width:200px;"> 
     <option value="AC">A</option> 
     <option value="AD">B</option> 
     <option value="AM">C</option> 
     <option value="AP">D</option> 
</select> 


</body> 
</html>

fonte

2012-12-18 18:44:43 Anass

Grazie. Ora ha funzionato :) – AimanB

<script type="text/javascript" src="chosen/chosen.jquery.min.js"></script> 
<script type="text/javascript"> 
$(function(){ 
    $(".chzn-select").chosen(); 
}); 
</script> 

<select class="chzn-select" multiple="true" name="faculty"> 
     <option value="AC">A</option> 
     <option value="AD">B</option> 
     <option value="AM">C</option> 
     <option value="AP">D</option> 
</select>

fonte

2012-12-18 18:45:44

Grazie ora ha funzionato :) – AimanB

Problemi correlati