我只想按ID显示所选类别的子类别。
我尝试使用分隔的select
,但是使用相同的名称很长,因为它需要检查每个名称是否为空...
也许我错了...我需要一些想法。
这是我的HTML:
<select class="form-control" name="catname" id="catname">
<option value="">Zgjidh Kategorine</option>
<option value="AUTOMJETE">AUTOMJETE</option>
<option value="VENDBANIME">VENDBANIME</option>
<option value="ELEKTRONIK">ELEKTRONIK</option>
<option value="SPORT">SPORT</option>
<option value="BIZNES-DHE-PUNE">BIZNES DHE PUNE</option>
<option value="TE-TJERA">TE TJERA</option>
</select>
</div>
</div>
<div class="col-md-4" id="AUTOMJETE">
<div class="form-group">
<label>Zgjidh Nen-Kategorine</label>
<select name="subname" class="form-control">
<option value="">Zgjidh Nen-Kategorine</option>
<option id="AUTOMJETE" value="Makina">Makina</option>
<option id="AUTOMJETE" value="Pjese Kembimi">Pjese Kembimi</option>
<option id="AUTOMJETE" value="Motocikleta">Motocikleta</option>
<option id="AUTOMJETE" value="Makineri Tonazh i Rende">Makineri Tonazh i Rende</option>
<option id="AUTOMJETE" value="Per Kamping">Per Kamping</option>
<option id="AUTOMJETE" value="Per Bujqesi">Per Bujqesi</option>
<option id="AUTOMJETE" value="Makineri Per Uje">Makineri Per Uje</option>
<option id="VENDBANIME" value="Shtepi">Shtepi</option>
<option id="VENDBANIME" value="Garazhde">Garazhde</option>
<option id="VENDBANIME" value="Apartamente">Apartamente</option>
<option id="VENDBANIME" value="Dhoma">Dhoma</option>
<option id="VENDBANIME" value="Vila">Vila</option>
<option id="VENDBANIME" value="Toke">Toke</option>
<option id="VENDBANIME" value="Objekte">Objekte</option>
<option id="ELEKTRONIK" value="Celulare">Celulare</option>
<option id="ELEKTRONIK" value="Pjese Per Celulare">Pjese Per Celulare</option>
<option id="ELEKTRONIK" value="Servis Celularesh">Servis Celularesh</option>
<option id="ELEKTRONIK" value="Telefona Fiks">Telefona Fiks</option>
<option id="ELEKTRONIK" value="Kompjutere">Kompjutere</option>
<option id="ELEKTRONIK" value="Pjese Per Kompjuter">Pjese Per Kompjuter</option>
<option id="ELEKTRONIK" value="Paisje Audio">Paisje Audio</option>
<option id="ELEKTRONIK" value="Televizore">Televizore</option>
<option id="ELEKTRONIK" value="Pjese Per Televizore">Pjese Per Televizore</option>
<option id="ELEKTRONIK" value="Film / Muzike">Film / Muzike</option>
<option id="ELEKTRONIK" value="Konzolate Per Lojra">Konzolate Per Lojra</option>
<option id="SPORT" value="Paisje Sportive">Paisje Sportive</option>
<option id="SPORT" value="Instrumente">Instrumente</option>
<option id="SPORT" value="Veshje/Kepuce">Veshje/Kepuce</option>
<option id="SPORT" value="Aksesore/Ora">Aksesore/Ora</option>
<option id="SPORT" value="Libra/Revista">Libra/Revista</option>
<option id="SPORT" value="Artikuj/Koleksion">Artikuj/Koleksion</option>
<option id="SPORT" value="Turizem dhe Evente">Turizem dhe Evente</option>
<option id="BIZNES-DHE-PUNE" value="Ambjente Biznesi">Ambjente Biznesi</option>
<option id="BIZNES-DHE-PUNE" value="Dorezim Biznesi">Dorezim Biznesi</option>
<option id="BIZNES-DHE-PUNE" value="Makineri Dhe Inventare">Makineri Dhe Inventare</option>
<option id="BIZNES-DHE-PUNE" value="Shitje me Shumice">Shitje me Shumice</option>
<option id="BIZNES-DHE-PUNE" value="Kafshe ne Ferme">Kafshe ne Ferme</option>
<option id="BIZNES-DHE-PUNE" value="Sherbime">Sherbime</option>
<option id="BIZNES-DHE-PUNE" value="Pune">Pune</option>
<option id="TE-TJERA" value="TE NDRYSHME">TE NDRYSHME</option>
</select>
这是我的jQuery代码:
$(function() {
$('#catname').change(function(){
$('#' + $(this).val()).show();
});
});
提前致谢 :)
最佳答案
使用类而不是重复的ID。
$(document).ready(function(){
$('#catname').change(function(){
$('.col-md-4 option').hide();
$('.' + $(this).val()).show();
});
});
.col-md-4 option{display:none;}
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<select class="form-control" name="catname" id="catname">
<option value="">Zgjidh Kategorine</option>
<option value="AUTOMJETE">AUTOMJETE</option>
<option value="VENDBANIME">VENDBANIME</option>
<option value="ELEKTRONIK">ELEKTRONIK</option>
<option value="SPORT">SPORT</option>
<option value="BIZNES-DHE-PUNE">BIZNES DHE PUNE</option>
<option value="TE-TJERA">TE TJERA</option>
</select>
<div class="col-md-4" id="AUTOMJETE">
<div class="form-group">
<label>Zgjidh Nen-Kategorine</label>
<select name="subname" class="form-control">
<option value="">Zgjidh Nen-Kategorine</option>
<option class="AUTOMJETE" value="Makina">Makina</option>
<option class="AUTOMJETE" value="Pjese Kembimi">Pjese Kembimi</option>
<option class="AUTOMJETE" value="Motocikleta">Motocikleta</option>
<option class="AUTOMJETE" value="Makineri Tonazh i Rende">Makineri Tonazh i Rende</option>
<option class="AUTOMJETE" value="Per Kamping">Per Kamping</option>
<option class="AUTOMJETE" value="Per Bujqesi">Per Bujqesi</option>
<option class="AUTOMJETE" value="Makineri Per Uje">Makineri Per Uje</option>
<option class="VENDBANIME" value="Shtepi">Shtepi</option>
<option class="VENDBANIME" value="Garazhde">Garazhde</option>
<option class="VENDBANIME" value="Apartamente">Apartamente</option>
<option class="VENDBANIME" value="Dhoma">Dhoma</option>
<option class="VENDBANIME" value="Vila">Vila</option>
<option class="VENDBANIME" value="Toke">Toke</option>
<option class="VENDBANIME" value="Objekte">Objekte</option>
<option class="ELEKTRONIK" value="Celulare">Celulare</option>
<option class="ELEKTRONIK" value="Pjese Per Celulare">Pjese Per Celulare</option>
<option class="ELEKTRONIK" value="Servis Celularesh">Servis Celularesh</option>
<option class="ELEKTRONIK" value="Telefona Fiks">Telefona Fiks</option>
<option class="ELEKTRONIK" value="Kompjutere">Kompjutere</option>
<option class="ELEKTRONIK" value="Pjese Per Kompjuter">Pjese Per Kompjuter</option>
<option class="ELEKTRONIK" value="Paisje Audio">Paisje Audio</option>
<option class="ELEKTRONIK" value="Televizore">Televizore</option>
<option class="ELEKTRONIK" value="Pjese Per Televizore">Pjese Per Televizore</option>
<option class="ELEKTRONIK" value="Film / Muzike">Film / Muzike</option>
<option class="ELEKTRONIK" value="Konzolate Per Lojra">Konzolate Per Lojra</option>
<option class="SPORT" value="Paisje Sportive">Paisje Sportive</option>
<option class="SPORT" value="Instrumente">Instrumente</option>
<option class="SPORT" value="Veshje/Kepuce">Veshje/Kepuce</option>
<option class="SPORT" value="Aksesore/Ora">Aksesore/Ora</option>
<option class="SPORT" value="Libra/Revista">Libra/Revista</option>
<option class="SPORT" value="Artikuj/Koleksion">Artikuj/Koleksion</option>
<option class="SPORT" value="Turizem dhe Evente">Turizem dhe Evente</option>
<option class="BIZNES-DHE-PUNE" value="Ambjente Biznesi">Ambjente Biznesi</option>
<option class="BIZNES-DHE-PUNE" value="Dorezim Biznesi">Dorezim Biznesi</option>
<option class="BIZNES-DHE-PUNE" value="Makineri Dhe Inventare">Makineri Dhe Inventare</option>
<option class="BIZNES-DHE-PUNE" value="Shitje me Shumice">Shitje me Shumice</option>
<option class="BIZNES-DHE-PUNE" value="Kafshe ne Ferme">Kafshe ne Ferme</option>
<option class="BIZNES-DHE-PUNE" value="Sherbime">Sherbime</option>
<option class="BIZNES-DHE-PUNE" value="Pune">Pune</option>
<option class="TE-TJERA" value="TE NDRYSHME">TE NDRYSHME</option>
</select>
</div>
</div>
关于javascript - jQuery仅在选中时显示ID选项{help},我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/42475240/