jquery checkbox checked and unchecked

Question

i need to write a javascript code that make the checkbox if checked view a textbox and if not checked the text box is invisable automatically without having a button to click on it to do that

<asp:Content ID="PageHead" ContentPlaceHolderID="PlaceHolderAdditionalPageHead" runat="server">
    <script type="text/javascript">

        $('#Checkbox').click(function(){
            var checked_status = this.checked;
            if(checked_status == true) {
                $('#txt').show();
            }
            else { $('#txt').hide();
            }
        }); </script>
</asp:Content>

<asp:Content ID="Main" ContentPlaceHolderID="PlaceHolderMain" runat="server">
    <input type="checkbox" id="checkbox"/>
    <input type="text" id="txt" style="display:none"/>
</asp:Content>

Answer 1

First: id in html elements and javascript are case sensitive:

#Checkbox ≠ #checkbox 

Second, change event is better than click for a checkbox.

$("#checkbox").change(function() {
   var checked = this.is(":checked");
   if (checked) {
      $("#txt").show();
   }
});

Third, you should wait until your dom is loaded, by declaring your script in $(document).ready:

$(document).ready(function() {
   $("#checkbox").change(function() {
      var checked = $(this).is(":checked");
      if (checked) {
         $("#txt").show();
      }
   });
});

Answer 2

Try this simpler to validate whether the checkbox is checked or not:

$('#Checkbox').is(':checked')
$('#Checkbox').attr('checked')