使用jQuery或Ajax显示或隐藏字段

Question

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

Answer 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();，这将在后端和视觉上触发更改

Answer 2

只需将选择器替换为适当的选择器：

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

Answer 3

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