我想顯示復選框資訊
就像當我選中復選框時,它會顯示復選框的資訊并隱藏其他復選框資訊
它的顯示/隱藏復選框資料
這是我的嘗試。
$('#mycountry').change(function() {
if ($(this).prop("checked")) {
$('#country').show();
} else {
$('#name').hide();
}
});
$('#myname').change(function() {
if ($(this).prop("checked")) {
$('#name').show();
} else {
$('#country').hide();
}
});
<input type="checkbox" id="myname" name="myname" checked>
<label for="myname"> Show my name</label><br>
<input type="checkbox" id="mycountry" name="mycountry">
<label for="mycountry"> Show my country</label><br>
<div id="country" style="display: none">
<span>Canada</span>
</div>
<div id="name">
<span>Steven</span>
</div>
uj5u.com熱心網友回復:
如果你想通過使用 jQuery 來實作,你應該用這個替換你的代碼:
<script>
$("#mycountry").change(function () {
if ($(this).prop("checked")) {
$("#country").show();
} else {
$("#country").hide();
}
});
$("#myname").change(function () {
if ($(this).prop("checked")) {
$("#name").show();
} else {
$("#name").hide();
}
});
</script>
所以現在如果你取消選中以顯示你的名字,你的名字“Steven”就會消失。
uj5u.com熱心網友回復:
請確保您使用正確的 HTML 標簽和腳本標簽。這應該可以解決問題。
您是否匯入了正確的庫?
jquery 代碼還需要位于以下標簽之間:
$(document).ready(function(){
});
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/396369.html
標籤:javascript html 查询
