使用 jQuery 或 Ajax 显示或隐藏字段 [关闭]答案

【问题标题】：Show or hide a field using jQuery or Ajax [closed]使用 jQuery 或 Ajax 显示或隐藏字段 [关闭]
【发布时间】：2012-03-04 00:09:33
【问题描述】：

我是 jQuery 新手，我想知道如何在单击（选择）复选框后在表单上显示日期字段，并在取消选择后将其隐藏。下面是截图。 - 谢谢。

【问题讨论】：

【解决方案1】：

HTML

<label for="chkEle">Check This</label>
<input type="checkbox" name="chkEle" />
<div id="divEle" style="display:none;"><date stuff></div>

$("input[name=chkEle]").change(function(e) {
    $("#divEle").toggle();
});

.change 即使点击标签而不是复选框也会触发。这也允许您稍后在 js 中动态进行更改。例如，如果您想在页面加载时强制选择复选框，那么您可以在代码末尾添加$("input[name=chkEle]").change();，这将触发后端和视觉上的更改

【讨论】：

【解决方案2】：

只需将选择器替换为合适的选择器即可：

$('checkbox_selector').click(function ()
{
    $('date_field_selector').toggle();
});

【讨论】：

【解决方案3】：

$('#checkBox').click(function() {
    $('#dateBox')[this.checked ? "show" : "hide"]();
});

【讨论】：

这并没有真正解决问题，因为它违背了拥有一个复选框的目的，他以后可以在该复选框上检查状态以执行更多功能。另外，这可能会导致视觉错误（正如我发现的那样），因为用户可以单击复选框标签并且对复选框本身没有影响，而使用 .change 即使单击标签而不是实际复选框也会受到影响跨度>