[英]fadeOut and fadeIn Div When Clicking Checkbox or its label
I want to fadeOut if the checkbox is unchecked, and fadeIn if the checkbox is checked. 如果未选中此复选框,则我想淡入,如果选中此复选框,则我希望fadeIn。 Also I have the label clickable so the text next to the checkbox should ideally do the same. 另外,我还具有可单击的标签,因此,理想情况下,复选框旁边的文本应执行相同的操作。 Heres what I have so far, it doesn't work but I'm not sure why: 这是我到目前为止的内容,它不起作用,但是我不确定为什么:
$(document).ready(function () {
$('#frequent1').on('change', function () {
if (!this.checked) {
$("#self").fadeOut;
}
});
});
HTML: HTML:
<label>
<input type="checkbox" id="frequent1" name="frequent1" value="self" checked> This
item: </label>
fadeOut is a jQuery function. fadeOut是一个jQuery函数。
This: 这个:
$("#self").fadeOut;
needs to be this: 需要这样的:
$("#self").fadeOut();
Do some corrections in your code, 在代码中进行一些更正,
create an element with id="self"
用id="self"
创建一个元素
fadeOut and fadeIn are not the properties, they are method in jQuery, so use fadeIn()
and fadeOut()
. fadeOut和fadeIn不是属性,它们是jQuery中的方法,因此请使用fadeIn()
和fadeOut()
。
$(document).ready(function () { $('#frequent1').on('change', function () { if (!this.checked) { $("#self").fadeOut(); } else{ $("#self").fadeIn(); } }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <label> <input type="checkbox" id="frequent1" name="frequent1" value="self" checked> <span id="self">This item: </span> </label>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.