我需要检查一个检查箱的检查财产,并使用jQuery进行检查财产的操作。
例如,如果年龄检查框被检查,那么我需要显示一个文本框进入年龄,否则隐藏文本框。
但下列代码默认返回虚假:
如果($('#isAgeSelected').attr('checked')) { $("#txtAge").show(); } 其他 { $("#txtAge").hide(); } <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="checkbox" id="isAgeSelected"/> <div id="txtAge" style="display:none"> 年龄 已选择 </div>
如何成功查询已检查的房地产?
当前回答
这对我来说工作:
/* isAgeSelected being id for checkbox */
$("#isAgeSelected").click(function(){
$(this).is(':checked') ? $("#txtAge").show() : $("#txtAge").hide();
});
其他回答
虽然您为您的问题提出了一个JavaScript解决方案(在检查时显示一个文本框),但这个问题只能通过CSS解决。
假设你有以下HTML:
<label for="show_textbox">Show Textbox</label>
<input id="show_textbox" type="checkbox" />
<input type="text" />
您可以使用以下 CSS 来实现所需的功能:
#show_textbox:not(:checked) + input[type=text] {display:none;}
对于其他场景,您可能会考虑适当的CSS选择器。
这里有一个Fiddle来展示这种方法。
这是我的工作:
$('#vcGoButton').click(function () {
var buttonStatus = $('#vcChangeLocation').prop('checked');
console.log("Status is " + buttonStatus);
if (buttonStatus) {
var address = $('#vcNewLocation').val();
var cabNumber = $('#vcVehicleNumber').val();
$.get('postCabLocation.php',
{address: address, cabNumber: cabNumber},
function(data) {
console.log("Changed vehicle " + cabNumber + " location to " + address );
});
}
else {
console.log("VC go button clicked, but no location action");
}
});
如果您需要使用 CSS 类作为 jQuery 选择器,您可以执行以下操作:
$(document).ready(function () {
$('.myOptionCheckbox').change(function () {
if ($(this).prop('checked') == true) {
console.log("checked");
}
else {
console.log("unchecked");
}
});
});
它也适用于检查箱和无线电盒。
在纯粹的JS检查箱状态中,更容易阅读
isAgeSelected.checked
函数检查() { txtAge.style.display= isAgeSelected.checked? 'block':'none'; } <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 年龄 <input type="checkbox" id="isAgeSelected"/> <button onclick="check()"> Check</button> <div id="txtAge" style="display:none"> 年龄 已选择 </div>
那么,这个解决方案呢?
$("#txtAge")[
$("#isAgeSelected").is(':checked') ?
'show' :
'hide'
]();
