jQuery div ausblenden, wenn das Kontrollkästchen aktiviert ist, wird auf deaktiviert angezeigt

Question

Ich versuche, div zu verbergen, wenn der Benutzer auf das Kontrollkästchen klickt, und zeigt es an, wenn der Benutzer das Kontrollkästchen deaktiviert. HTML:

<div id="autoUpdate" class="autoUpdate"> 
    content 
</div> 

jQuery:

<script> 
$('#checkbox1').change(function(){ 
     if (this.checked) { 
      $('#autoUpdate').fadeIn('slow'); 
     } 
     else { 
      $('#autoUpdate').fadeOut('slow'); 
     }     
    }); 
</script> 

ich eine harte Zeit habe diese Funktion zu erhalten.

Answer 1

Verwenden Sie unbedingt das Ereignis ready.

Code:

$(document).ready(function(){ 
    $('#checkbox1').change(function(){ 
     if(this.checked) 
      $('#autoUpdate').fadeIn('slow'); 
     else 
      $('#autoUpdate').fadeOut('slow'); 

    }); 
}); 

Answer 2

HTML

<input type="checkbox" id="cbxShowHide"/><label for="cbxShowHide">Show/Hide</label> 
<div id="block">Some text here</div> 

css

#block{display:none;background:#eef;padding:10px;text-align:center;} 

Javascript/jquery

$('#cbxShowHide').click(function(){ 
this.checked?$('#block').show(1000):$('#block').hide(1000); //time for show 
});