JQuery 和 ASP MVC 双击错误答案

【问题标题】：Double clicking error with JQuery and ASP MVCJQuery 和 ASP MVC 双击错误
【发布时间】：2014-12-08 16:47:00
【问题描述】：

早上好！我的剃刀中有一个复选框，它在选中复选框时，它显示了DatePicker的div。我的错误是当我双击复选框时显示带有日期选择器的 div 时未选中（与我需要的相反）。

这是我的代码：

<div class="form-group">
      @Html.LabelFor(model => model.SupHUBZoneCertified, htmlAttributes: new { @class = "control-label col-md-4" })
      <div class="col-md-8">
           <div class="checkbox" id="cb1">
               <label>
                  @Html.EditorFor(model => model.SupHUBZoneCertified)
                  @Html.ValidationMessageFor(model => model.SupHUBZoneCertified, "HUB Zone Certified:")
               </label>
            </div>
        </div>
 </div>

 <div class="form-group" id="dateCb1" style="display:none">
      @Html.LabelFor(model => model.SupCategoryHUBZoneDate, htmlAttributes: new { @class = "control-label col-md-4" })
      <div class="col-md-8">
           @Html.EditorFor(model => model.SupCategoryHUBZoneDate, new { htmlAttributes = new { @class = "form-control datepicker" } })
           @Html.ValidationMessageFor(model => model.SupCategoryHUBZoneDate, "", new { @class = "text-danger" })
       </div>
  </div>

还有我的javascript：

$("#cb1").click(function () {
    $("#dateCb1").toggle(this.checked);
});

【问题讨论】：

标签： javascript jquery asp.net asp.net-mvc razor

【解决方案1】：

假设您使用的是 jQuery UI 日期选择器，我在 api docs 中看不到 toggle 方法

只有show 和hide 方法。

所以你应该修改你的代码：

$("#cb1").click(function () {
    var action = this.checked ? "show" : "hide";
    $("#dateCb1").datepicker(action);
    $("#dateCb1").toggle(this.checked);
});

【讨论】：

谢谢 Vsevolod 确实我正在使用 jQuery UI 日期选择器，但是我没有显示或隐藏日期选择器。我正在显示和隐藏带有标签和日期选择器的 div。
@CesarD 啊哈，我明白了，尝试结合隐藏潜水和关闭日期选择器。我修改了答案
谢谢 Vsevolod，您的代码和我的代码都可以正常工作。如果我选中显示 div 并且如果我取消选中它不会但是如果我双击未选中时显示 div 并在选中时隐藏 div。

【解决方案2】：

谢谢大家我发现了错误，所以基本上我不能使用#cb1作为复选框ID，因为我需要使用输入的ID。输入的 ID 在 ASP MVC 中自行生成，并使用 MVC 模型中声明的名称。

所以代码是

 $("#SupHUBZoneCertified").click(function () {
    $("#dateCb1").toggle(this.checked);
});

我使用“Inspect Element in Internet Explorer”找到了输入类名称

【讨论】：