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

Posted 2023-05-07

【中文标题】使用 jQuery 或 Ajax 显示或隐藏字段 [关闭]

【英文标题】：Show or hide a field using jQuery or Ajax [closed]

【发布时间】：2012-03-04 00:09:33

【问题描述】：

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

【问题讨论】：

您是否尝试过使用 jquery 文档？这很简单，示例非常有用和示例。尝试研究工作

How to hide/show content when checkbox is checked/unchecked?的可能重复

【参考方案1】：

HTML

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

JS

$("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 即使单击标签而不是实际复选框也会受到影响跨度>