![](/img/trans.png)
[英]How to show/hide <div> when <mat-checkbox> is checked/unchecked?
[英]jQuery hide div when checkbox checked, show on unchecked
我試圖在用戶點擊復選框時隱藏div,並在用戶取消選中該復選框時顯示該div。 HTML:
<div id="autoUpdate" class="autoUpdate">
content
</div>
jQuery的:
<script>
$('#checkbox1').change(function(){
if (this.checked) {
$('#autoUpdate').fadeIn('slow');
}
else {
$('#autoUpdate').fadeOut('slow');
}
});
</script>
我很難讓這個工作。
確保使用ready
事件。
碼:
$(document).ready(function(){
$('#checkbox1').change(function(){
if(this.checked)
$('#autoUpdate').fadeIn('slow');
else
$('#autoUpdate').fadeOut('slow');
});
});
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
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.