我在网站上有以下jQuery函数:
$('#CAT_Custom_381715_0').click(function () {
$(".grow").fadeIn("slow");
});
我的目标是,当单击一个复选框时,它将显示表单的其他部分。
HTML代码如下:
<tr>
<td><label>Have You Grown This Plant?</label><br />
<input type="checkbox" value="Yes" id="CAT_Custom_381715_0" />Yes</td>
</tr>
<tr class="grow"> <!-- FORM CODE --> </tr>
<tr class="grow"> <!-- FORM CODE --> </tr>
.grow
.grow{
display:none;
}
我认为与导致问题的表格有关。没有错误被抛出。我最初有一个div包装代码但Firefox将删除div。不确定这是Firefox还是我的CMS。
问题是<tr>
类grow
在点击复选框时未显示。
如何让jQuery正常工作。
答案 0 :(得分:3)
我将点击行为切换为开启并且正在切换。不过,我还建议您阅读这篇文章,并确保检查您的复选框是否实际检查,而不是仅仅点击。
Setting "checked" for a checkbox with jQuery?
以下是Codepen链接:http://cdpn.io/jztKb
<强> HTML 强>
<table>
<tr>
<td><label>Have You Grown This Plant?</label><br />
<input type="checkbox" value="Yes" id="CAT_Custom_381715_0" />Yes</td>
</tr>
<tr class="grow"><td>Hi</td></tr>
<tr class="grow"><td>Hi</td></tr>
</table>
<强> CSS 强>
.grow {
display: none;
}
<强>的jQuery 强>
$('#CAT_Custom_381715_0').on('click', function() {
$(".grow").fadeToggle("slow");
});