Laksanakan kotak lungsur berdasarkan jQuery_jquery

Kami sering menemui kotak drop-down dalam projek Hari ini, apabila susun atur rata dan responsif adalah sangat perlu untuk menggunakan jQuery untuk melaksanakan kotak drop-down, dan ia juga akan menjadi lebih cantik kod kotak Jatuh turun berasaskan jQuery.

Kod jQuery:

Salin kod Kod adalah seperti berikut:

         $(function(){
                 $('#add').klik(function(){
                var $options = $('#select1 option:selected');                        $options.appendTo("#select2");               });
                 $('#remove').klik(function(){
                var $options = $('#select2 option:selected');                       $options.appendTo("#select1");               });
                 $('#add_all').klik(function(){
                var $options = $('#select1 option');                        $options.appendTo("#select2");               });
                 $('#remove_all').klik(function(){
                var $options = $('#select2 option');                       $options.appendTo("#select1");               });
                 $('#select1').dblclick(function(){
              var $options = $("option:selected",this); //Dapatkan pilihan yang dipilih
                       $options.appendTo('#select2');               });
                  $('#select2').dblclick(function(){
              var $options = $("option:selected",this); //Dapatkan pilihan yang dipilih
                        $options.appendTo('#select1');               });
         });



Kod HTML:





Salin kod

Kod adalah seperti berikut:

  

  

      
           选项1
           选项2
           选项3
           选项4
           选项5
           选项6
           选项7
           选项8
      
      

           选中添加到右边>>

           全部添加到右边>>
      

  

  

      
      
      

           <<选中删除到左边

           <<全部删除到左边
      

  

是不是很简单？小伙伴们需要的话直接就可以拿到项目中使用了。