选中复选框后获取值

我正在使用jQuery函数来获取已选中复选框的值。

如果不再选中该复选框，如何隐藏span类“active-usb”中的值？

HTML

jQuery的

 $("#getusb").change(function(){ $('.active-usb').text($("#getusb:checkbox:checked").val()); }).change(); 

Answer 1

您可以使用checked属性来确定是否选中了复选框。 然后，您可以使用this方法获取引发事件的复选框的值。 试试这个：

 $("#getusb").change(function(){ $('.active-usb').text(this.checked ? $(this).val() : ''); }).change(); 

Answer 2

既然你问如何隐藏它：

 $('.active-usb').toggle(this.checked); 

Answer 3

您可以检查ckeckbox状态：

 $("#getusb").on("change", function() { //check if is checked if (this.checked) { //set the span text according to checkbox value $('.active-usb').text(this.value); } else { //if is not checked hide span $(".active-usb").hide(); } }); 

Answer 4

你可以尝试这样的事情： –

 $("#getusb").change(function(){ if($(this).is(':checked')){ $('.active-usb').text($(this).val()); } else{ $('.active-usb').text(''); } }).change(); 

要么

 $("#getusb").change(function(){ $('.active-usb').text($(this).is(':checked') ? $(this).val() : ''); }).change(); 

Answer 5

在这里使用此演示

 $("#getusb").on('change',function(){ if($('#getusb').prop('checked')== true){ $('.active-usb').text($("#getusb:checkbox:checked").val()); }else{ $('.active-usb').text(''); } }).change(); 

Answer 6

使用isChecked并在document.ready中

 $(document).ready( $("#getusb").on('change',function(){ if($(this).is(':checked')){ $('.active-usb').text($(this).val()); } else{ $('.active-usb').text(''); } }); )