Sayfamda bazı giriş metin alanları var ve bunların değerlerini JavaScript kullanarak görüntülüyorum.
Değeri düzenlemek, ekstra bir onay kutusu alanı eklemek ve bir değer iletmek için .set("value","")
işlevini kullanıyorum.
Burada value == 1
ise bu onay kutusunun işaretlenmesi gerektiğini kontrol etmek istiyorum. Aksi takdirde, işaretlenmemiş olarak kalmalıdır.
Bunu iki div kullanarak yaptım, ancak bununla rahat hissetmiyorum, başka bir çözüm var mı?
if(value == 1) {
$('#uncheck').hide();
$('#check').show();
} else{
$('#uncheck').show();
$('#check').hide();
}
JQuery 1.6+ için :
Özellikler için .attr() işlevi kullanımdan kaldırılmıştır; bunun yerine yeni .prop() işlevini kullanın:
$('#myCheckbox').prop('checked', true); // Checks it
$('#myCheckbox').prop('checked', false); // Unchecks it
JQuery < 1.6 için:
Bir onay kutusunu işaretlemek/işaretini kaldırmak için checked
niteliğini kullanın ve bunu değiştirin. jQuery ile yapabilirsiniz:
$('#myCheckbox').attr('checked', true); // Checks it
$('#myCheckbox').attr('checked', false); // Unchecks it
Çünkü bilirsiniz, HTML'de şöyle bir şey görünür:
<input type="checkbox" id="myCheckbox" checked="checked" /> <!-- Checked -->
<input type="checkbox" id="myCheckbox" /> <!-- Unchecked -->
Ancak, onay kutusunun değerini almak için .attr() yöntemine güvenemezsiniz (gerekirse). Bunun için .prop() yöntemine güvenmeniz gerekecektir.
Bunun için prop() yöntemini kullanabilirsiniz, çünkü JQuery 1.6 öncesinde .attr() yöntemi bazen bazı nitelikleri alırken özellik değerlerini dikkate alıyordu ve bu da tutarsız davranışlara neden olabiliyordu. jQuery 1.6 itibariyle, .prop()
yöntemi özellik değerlerini açıkça almak için bir yol sağlarken, .attr()
yöntemi öznitelikleri alır.
var prop=false;
if(value == 1) {
prop=true;
}
$('#checkbox').prop('checked',prop);
veya basitçe,
$('#checkbox').prop('checked',(value == 1));
Snippet
$(document).ready(function() {
var chkbox = $('.customcheckbox');
$(".customvalue").keyup(function() {
chkbox.prop('checked', this.value==1);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<h4>This is a domo to show check box is checked
if you enter value 1 else check box will be unchecked </h4>
Enter a value:
<input type="text" value="" class="customvalue">
<br>checkbox output :
<input type="checkbox" class="customcheckbox">