Question

这是我在这个页面上的第300个问题，我很累。我一直在寻找，但看不出我做错了什么（我是jQ的新手）。我正处于在复选框上进行切换的早期阶段。目前我只是在点击时触发处理程序而没有努力检查稍后出现的“已检查”，我认为我很好。

请问我做错了什么。

<div class="form-group  col-sm-3 colFlushR" id="endDateWrapper">
    <label class="control-label" for="zaq-endDate">End Date</label>
    <div class="input-group date colFlush" data-provide="datepicker" id="datepickerEnd">
        <input type="text" class="form-control" name="zaq-endDate" id="zaq-endDate">
        <span class="input-group-addon"><i class="glyphicon glyphicon-th"></i></span>
    </div>
</div>

<div class="btn-group-xs" data-toggle="buttons"><br> &nbsp;
    <label class="btn btn-default" id="endDateYesNo">
        <span class="glyphicon glyphicon-unchecked"></span>
        <input type="checkbox" class="weekend day" value="zaq-satuxxxrday"
                name="saturday"> End Date?
    </label>
</div>

简单的脚本（或者我认为）

"use strict";
$(document).ready(function() {
    var $endWrap = $("#endDateWrapper")
//        $endWrap.hide()
    $("#endDateYesNo").on(click,function()
    {
        $endWrap.toggle();
    })
});

Answer 1

您想要$("#endDateYesNo").on("click",function() - 注意事件类型click周围的引号。 jQuery API page包含有关on用法的更详细信息。

或者，您可以改为使用$("#endDateYesNo").click(function()...，但on方法更新且更受欢迎，因为如果需要，它可以轻松用于委派点击侦听器。

Answer 2

试试这个：

$(document).ready(function() {
    var endWrap = $("#endDateWrapper")
    //  endWrap.hide()
    $("#endDateYesNo").on("click",function()
    {
        endWrap.toggle();
    });
});

或者，如果您想滑动它，可以使用：endWrap.slideToggle();

简单的jQuery切换

2 个答案: