masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu
Rumah > hujung hadapan web > tutorial js > Select标签下拉列表二级联动级联实例代码_javascript技巧

Select标签下拉列表二级联动级联实例代码_javascript技巧

WBOY
Lepaskan： 2016-05-16 17:01:17
asal
1289 orang telah melayarinya

首先从服务器端，绑定下拉列表，二级下拉的text命名按照一定规则加上一级下拉的ID。

复制代码 代码如下:

var options=new Array();
    $(document).ready(function(){
        //二级联动
        $('#ddlPages').children('option').each(function(i){
            options[i]='';
        });//将option列表放到数组里
        $('#ddlPages option:gt(0)').remove();    //清楚下拉
        $('#ddlSubsystems').bind('change',function(){        //注册事件
            var systemname=$('#ddlSubsystems option:selected').text();
            for(var j=0;j                $('#ddlPages').append(options[j]);
            }    //option列表先初始化
            $('#ddlPages option:gt(0)').each(function(i){    //遍历排除
                var textname=$(this).text();
                var index=textname.indexOf('-'+systemname);
                if(index                    $(this).remove();
                }else{
                    $(this).text(textname.substring(0,index));
                }
            });
            $('#ddlPages').val(0);                            //默认选中第一行
        });
    });
Label berkaitan：
select 下拉列表
sumber：php.cn
Artikel sebelumnya：jquery select 设置默认选中的示例代码_jquery Artikel seterusnya：javascript中match函数的用法小结_javascript技巧
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Isu terkini
SQL Count() juga memerlukan 0 Saya hanya mempunyai satu jadual dan saya ingin mengira setiap entri tag yang bermula deng...
daripada 2024-04-06 19:48:53
0
1
449
sql groupby tidak berfungsi, saya mahu kumpulan mengikut code_branch ->pilih('a.statusasstatus','b.nameascustomer_name','e.nameasbranch_name','c.nameasc...
daripada 2024-04-06 19:24:49
0
2
488
Ralat telah ditemui semasa cuba mendapatkan semula versi terkini pakej daripada search.maven.org "Ralat: Tidak dapat mengambil data daripada repositori Maven" semasa mendapatkan...
daripada 2024-04-05 12:11:23
0
1
1471
Ubah suai gaya matSelect apabila memaparkan pilihan Bagaimana untuk menukar sifat pilih tikar apabila pilihan dihidupkan? <mat-selectclass=...
daripada 2024-04-05 09:23:19
0
1
1374
Gema di dalam div dengan gema bersarang Saya cuba menggunakan echo<?phprequire'connect.php';$query=mysqli_query($conn,"SEL...
daripada 2024-04-04 11:09:23
0
1
390
Topik-topik yang berkaitan
Lagi>
Cadangan popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan