В этом коде я использую раскрывающийся список в качестве примера
<div class = "dropdown">
<button class = "btn btn-light btn-block dropdown-toggle" type = "button" id = "bahagian" data-toggle = "dropdown" aria-haspopup = "true" aria-expanded = "false">Bahagian </button>
<div class = "dropdown-menu" id = "checkboxes1" aria-labelledby = "bahagian" style = "height: auto; max-height: 200px; overflow-x: hidden; width: 100%;">
<li class = "dropdown-item">
<input type = "checkbox" name = "bahagian[]" value = "JB"><label>Johor Bahru</label>
</li>
<li class = "dropdown-item">
<input type = "checkbox" name = "bahagian[]" value = "TE"><label>Tebrau</label>
</label>
<li class = "dropdown-item">
<input type = "checkbox" name = "bahagian[]" value = "PG"></label>Pasir Gudang</label>
</li>
</div>
<div id = "output1" class = ""></div><br>
</button>
</div>
В настоящее время это код javascript, который я использовал для отображения значений, и он работает, но как отобразить метку?
<script>
$("#checkboxes input").click(function () {
$("#output").text($("#checkboxes input:checked").map(function () {
return $(this).val();
}).get().join());
}).click().click();
</script>
🤔 А знаете ли вы, что...
JavaScript можно использовать для создания анимаций и игр на веб-страницах.
в вашем коде есть ошибки. вот что у меня есть (https://jsfiddle.net/7a1moxqc/)
<div class = "dropdown">
<button class = "btn btn-light btn-block dropdown-toggle" type = "button" id = "bahagian" data-toggle = "dropdown" aria-haspopup = "true" aria-expanded = "false">Bahagian </button>
<div class = "dropdown-menu" id = "checkboxes1" aria-labelledby = "bahagian" style = "height: auto; max-height: 200px; overflow-x: hidden; width: 100%;">
<li class = "dropdown-item">
<input type = "checkbox" id = "jb" name = "bahagian[]" value = "JB"><label for = "jb">Johor Bahru</label>
</li>
<li class = "dropdown-item">
<input type = "checkbox" id = "te" name = "bahagian[]" value = "TE"><label for = "te">Tebrau</label>
</li>
<li class = "dropdown-item">
<input type = "checkbox" id = "pg" name = "bahagian[]" value = "PG"><label for = "pg">Pasir Gudang</label>
</li>
</div>
<div id = "output1" class = ""></div><br>
</div>
$("input:checkbox").on("change", function() {
var out = $("input:checked").map(function() {
var id = $(this).attr("id");
return $("label[for='" + id + "']").html();
});
$("#output1").text([...out].join(", "));
});