lselect的option叠加问题如何解决
这次给大家带来lselect的option叠加问题如何解决，解决lselect的option叠加问题的注意事项有哪些，下面就是实战案例，一起来看一下。
小编我在使用layui，在select的地方遇到了坑，select里的值居然无法清空，select里的option还有叠加问题，为了解决这个问题，也达到我的功能，我研究了下，让有同样需求的小伙伴不踩坑，特贴上我的源码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>layui-下拉框联动测试</title>
<link rel="stylesheet" href="layui/css/layui.css" rel="external nofollow" >
</head>
<body>
<p id="wrap">
<p class="layui-form" lay-filter="merchantForm">
<p class="layui-form-item">
<label class="layui-form-label">选择框</label>
<p class="layui-input-block">
<select name="city" lay-verify="required" id="test1" lay-filter="test1">
<option value="0">时间</option>
<option value="1">金额</option>
</select>
</p>
</p>
<p class="layui-form-item">
<label class="layui-form-label">选择框</label>
<p class="layui-input-block">
<select name="city" lay-verify="required" id="test2" lay-filter="test2">
<option value="">请选择规则名称</option>
</select>
</p>
</p>
</p>
<button id="btn">确定</button>
</body>
<script src="layui/layui.all.js"></script>
<script src="layui/jquery-1.8.3.min.js"></script>
<script>
//后台传过来的数据
var data=[
{unitType:0,ruleName:'时间规则11',amount:1100,money:1100},
{unitType:0,ruleName:'时间规则12',amount:1200,money:1200},
{unitType:0,ruleName:'时间规则13',amount:1300,money:1300},
{unitType:1,ruleName:'金额规则21',amount:2100,money:2100},
{unitType:1,ruleName:'金额规则22',amount:2200,money:2200},
{unitType:1,ruleName:'金额规则23',amount:2300,money:2300},
];
//初始化默认为时间类型以及对应的时间规则
layui.use('form', function(){
var form = layui.form;
$('#test2').html('');
var html='';
$.each(data,function(i,e){
if(e.unitType==0)
html+=`<option data-type="${e.unitType}">${e.ruleName}</option>`;
})
$('#test2').append(html);
form.render('select');
})
//动态二级联动
layui.use('form', function(){
var form = layui.form;
form.on('select(test1)', function(obj){
$('#test2').html('');
var html='';
if(obj.value==0){
$.each(data,function(i,e){
if(e.unitType==obj.value)
html+=`<option data-type="${e.unitType}">${e.ruleName}</option>`;
})
$('#test2').append(html);
}else if(obj.value==1){
$.each(data,function(i,e){
if(e.unitType==obj.value)
html+=`<option data-type="${e.unitType}">${e.ruleName}</option>`;
})
$('#test2').append(html);
}
form.render('select');
});
})
//二级联动完毕后获取对应的规则数据
$('#btn').click(function(){
var thisValue=data.find((v)=>v.ruleName==$('#test2').val());
console.log(thisValue);
})
</script>
</html>相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！
推荐阅读：
Atas ialah kandungan terperinci lselect的option叠加问题如何解决. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Alat AI Hot
Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik
AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.
Undress AI Tool
Gambar buka pakaian secara percuma
Clothoff.io
Penyingkiran pakaian AI
Video Face Swap
Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!
Artikel Panas
Alat panas
Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma
SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan
Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa
Dreamweaver CS6
Alat pembangunan web visual
SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)
Topik panas
1392
52
Apakah maksud pilihan dalam dokumentasi linux?
Mar 07, 2023 am 10:41 AM
Di Linux, pilihan merujuk kepada pilihan arahan, iaitu suis yang melaraskan tingkah laku pelaksanaan perintah Iaitu, pilihan yang berbeza menentukan hasil paparan arahan. Pilihan dibahagikan kepada pilihan panjang dan pilihan pendek: 1. Pilihan pendek dipandu oleh "-". .
Adakah terdapat masa depan untuk pekerjaan dalam farmasi klinikal di Universiti Perubatan Harbin? (Apakah prospek pekerjaan untuk farmasi klinikal di Universiti Perubatan Harbin?)
Jan 02, 2024 pm 08:54 PM
Apakah prospek pekerjaan farmasi klinikal di Universiti Perubatan Harbin Walaupun situasi pekerjaan negara tidak optimistik, graduan farmaseutikal masih mempunyai prospek pekerjaan yang baik. Secara keseluruhannya, bekalan graduan farmaseutikal adalah kurang daripada permintaan Syarikat farmaseutikal dan kilang farmaseutikal adalah saluran utama untuk menyerap graduan tersebut. Menurut laporan, dalam beberapa tahun kebelakangan ini, nisbah bekalan-permintaan untuk pelajar siswazah dalam jurusan seperti persediaan farmaseutikal dan kimia perubatan semula jadi telah mencapai 1:10. Arah pekerjaan jurusan farmasi klinikal: Selepas tamat pengajian, pelajar jurusan perubatan klinikal boleh melibatkan diri dalam rawatan perubatan, pencegahan, penyelidikan perubatan, dsb. dalam unit perubatan dan kesihatan, penyelidikan perubatan dan jabatan lain. Jawatan pekerjaan: Wakil perubatan, wakil jualan farmaseutikal, wakil jualan, pengurus jualan, pengurus jualan wilayah, pengurus pelaburan, pengurus produk, pakar produk, jururawat
Bagaimana untuk memuat turun imej win10 dengan cepat
Jan 07, 2024 am 11:33 AM
Baru-baru ini, beberapa rakan melaporkan cara memuat turun fail imej win10 Kerana terdapat banyak fail imej di pasaran, apakah yang perlu saya lakukan jika saya ingin mencari fail biasa untuk dimuat turun? Hari ini, editor telah membawakan anda pautan untuk memuat turun imej dan langkah penyelesaian terperinci Mari kita lihat bersama-sama. muat turun pantas imej win10 dan pautan muat turun tutorial pemasangan >>> Sistem Home Ghostwin101909 imej versi 64-bit v2019.11<<<>>>Imej Win10 64-bit v2019.07<<<>>>Imej Win10 32-bit v2019. 07<< <1. Cari melalui Internet
Bagaimana untuk membersihkan folder temp
Feb 22, 2024 am 09:15 AM
Cara membersihkan folder temp Semasa kami menggunakan komputer, fail sementara (fail temp) akan terkumpul secara beransur-ansur. Fail sementara ini dijana apabila kami menggunakan komputer, seperti fail cache semasa menyemak imbas web, fail sementara semasa pemasangan perisian, dsb. Kegagalan untuk membersihkan folder temp untuk masa yang lama mungkin menduduki sejumlah besar ruang cakera dan menjejaskan kelajuan komputer. Oleh itu, membersihkan folder temp dengan kerap adalah langkah yang perlu untuk mengekalkan prestasi komputer. Di bawah, kami akan memperkenalkan beberapa cara mudah untuk membersihkan folder temp. Kaedah 1: Bersihkan t secara manual
Bagaimana untuk menetapkan semula sistem Win10
Jun 29, 2023 pm 03:14 PM
Bagaimana untuk menetapkan semula sistem Win10? Pada masa kini, ramai rakan suka menggunakan komputer dengan sistem Win10 Namun, mereka pasti akan menghadapi beberapa masalah yang tidak dapat diselesaikan pada masa ini, anda boleh cuba untuk menetapkan semula sistem. Mari ikuti editor untuk menonton tutorial menetapkan semula sistem Win10 Pengguna yang memerlukan tidak boleh ketinggalan. Tutorial menetapkan semula sistem Win10 1. Klik Windows dan pilih Tetapan. 2. Klik Kemas Kini dan Keselamatan. 3. Pilih Pulihkan. 4. Klik Mula di sebelah kanan untuk menetapkan semula komputer ini. Di atas adalah keseluruhan kandungan [Cara menetapkan semula sistem Win10 - Tutorial menetapkan semula sistem Win10].
Bagaimana untuk menyemak konfigurasi komputer win11
Jun 29, 2023 pm 12:15 PM
Bagaimana untuk menyemak konfigurasi komputer win11? Sistem win11 adalah versi sistem pengendalian komputer yang sangat praktikal Versi ini menyediakan pengguna dengan fungsi yang kaya, membolehkan pengguna untuk mempunyai pengalaman pengendalian komputer yang lebih baik dalam sistem win11? Ramai rakan tidak tahu bagaimana untuk beroperasi secara terperinci Editor telah menyusun tutorial tentang cara melihat konfigurasi komputer win11 di bawah Jika anda berminat, ikuti editor dan teruskan membaca. Tutorial paparan konfigurasi komputer Win11 1. Klik ikon tetingkap pada bar tugas di bawah atau tekan "kekunci tetingkap" pada papan kekunci untuk membuka menu mula. 2. Cari "Tetapan" atau "sett" dalam menu mula.
Selesaikan masalah pengesanan persekitaran apabila memasang semula sistem
Jan 08, 2024 pm 03:33 PM
Bagaimana untuk menyelesaikan masalah bahawa ujian persekitaran gagal apabila memasang semula sistem dan perlu ditulis semula Sebabnya ialah: telefon mudah alih anda boleh memasang perisian anti-virus seperti Pengurus Mudah Alih untuk anti-virus fail disimpan di dalam telefon bimbit, menyebabkan memori berjalan telefon bimbit itu diduduki. Kosongkan cache telefon untuk menyelesaikan masalah ini 3. Memori telefon terlalu banyak diduduki oleh perisian dan fail yang disimpan Tidak ada masalah untuk memadamkan fail dan perisian yang tidak diperlukan dengan kerap Selagi konfigurasi perkakasan anda memenuhi keperluan pemasangan, anda boleh gunakan yang baharu secara langsung. Pasang semula sistem daripada cakera sistem! Anda boleh menggunakan pemacu kilat USB atau cakera keras untuk memasang, yang sangat pantas. Tetapi kuncinya ialah menggunakan cakera sistem dengan keserasian yang baik (menyokong pemasangan dalam mod IDE, ACHI, dan RAID), dan ia boleh diaktifkan secara automatik dan kekal, yang telah disahkan. jadi
Apakah yang dimaksudkan pilihan dalam dokumentasi linux?
May 16, 2023 am 09:55 AM
Di Linux, pilihan merujuk kepada pilihan arahan, iaitu suis yang melaraskan tingkah laku pelaksanaan perintah Iaitu, pilihan yang berbeza menentukan hasil paparan arahan. Pilihan dibahagikan kepada pilihan panjang dan pilihan pendek: 1. Pilihan pendek dipandu oleh "-". . Pengenalan kepada pilihan perintah (pilihan) dan parameter dalam Linux Selepas log masuk ke Linux, kita boleh memasukkan arahan selepas simbol # atau $ Kadangkala arahan akan diikuti oleh "pilihan" (pilihan bahasa Inggeris) atau "parameter" (argumen bahasa Inggeris). . Iaitu, format arahan dalam Linux ialah: command[opti
