Heim >Web-Frontend >js-Tutorial >Eine einfache JQuery-Dropdown-Box mit Mehrfachauswahl (selbst geschrieben)_jquery

Eine einfache JQuery-Dropdown-Box mit Mehrfachauswahl (selbst geschrieben)_jquery

WBOY
WBOYOriginal
2016-05-16 16:50:001310Durchsuche

Das Projekt, an dem ich heute arbeitete, erforderte die Verwendung einer Dropdown-Liste mit mehreren Auswahlmöglichkeiten. Ich wollte zunächst ein Plug-in im Internet finden, um es zu verwenden Ich habe auf einige Plug-Ins im Internet verwiesen und mit jquery ein Multi-Select-Plug-In geschrieben. Das Dropdown-Feld ist relativ prägnant in js geschrieben. Der Code lautet wie folgt.

JS-Code

Code kopieren Der Code lautet wie folgt:

( function() {
$.fn.extend({
checks_select: function(options){
jq_checks_select = null;
$(this).click(function(e){
jq_check = $( this);
//jq_check.attr("class", "");
if (jq_checks_select == null) {
jq_checks_select = $("
< ;/div>").insertAfter(jq_check);
$.each(options, function(i, n){
check_div=$("
" n "
").appendTo(jq_checks_select);
check_box=check_div.children();
check_box.click(function(e){
/ /jq_check.attr("value",$(this).attr("value") );

temp=""
$("input:checked").each( function(i ){
if(i==0){
temp=$(this).attr("value");
}else{
temp="," $(this ).attr ("value");
}
jq_check.attr("value",temp(t)); >}) ;
}else{
jq_checks_select();

}
e.stopPropagation();
$(document).click (function ( ) {
jq_checks_select.hide();
});
//$(this).blur(function(){
//jq_checks_select.css("visibility"," versteckt") ;
//alert();
//});
}
})

})(jQuery);


html



Code kopieren
Der Code lautet wie folgt: /javascript" src=" js/jquery2.1.js">
style>
.checks_div_select {
width: 150px;
border: 1px solid #18cbcd;
Schriftgröße: 12px
links:25px
>






Erfordert eine JQuery-Bibliothek
Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn