Javascript

Radiobuttona Göre Label’in İçeriğinin Değişmesi







<body>
<form class="needs-validation" novalidate="" id="mainForm" name="mainForm">

<h4>Radiobutton'a göre Label'in Değişimi</h4>
<div class="d-block my-3">
<div class="custom-control custom-radio">
<input id="credit" name="gender" type="radio" value="No 1" class="custom-control-input"
checked="">
<label class="custom-control-label" for="credit">Radio 1</label>
</div>

<div class="custom-control custom-radio">
<input id="debit" name="gender" type="radio" value="No 2" class="custom-control-input">
<label class="custom-control-label" for="debit">Radio 2</label>
</div><br>

<div class="row">

<strong><div class="col-md-2 mb-2 ">
<label id="sonuc" for="sonuc" name="sonuc">No 1</label>
<input type="text" class="form-control" placeholder="placeholderrrr">
</div></strong>




</form>
<script src="assets/js/dev/jquery-3.3.1.min.js" type="text/javascript"></script>
<script src="assets/js/all.js" type="text/javascript"></script>
</body>
<script>
document.mainForm.onclick = function(){
var gender = document.querySelector('input[name = gender]:checked').value;
sonuc.innerHTML = gender;
}
</script>



İlgili Makaleler

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Başa dön tuşu