jQuery选择器用于“Html.CheckBoxFor”

Question

有没有办法使用asp.net / jquery在类似以下复选框的情况下切换div的可见性： <%：Html.CheckBoxFor（m => m.Type）％> 我知道如何处理jQuery部分，但是我不确定如何确定是否已单击或更改该框。我可以添加onChange或onClick之类的内容吗？

编辑 - 让我稍微修改一下...我如何为Html.CheckBoxFor（）分配一个id？

- Cody

---

我认为复选框的ID将自动设置为其创建的对象属性。因此，在上面的示例中，它将是“id =”Type“”。您可以随时查看代码创建的标记以进行双重检查。 - ipr101

Answer 1

你可以订阅.change()事件，并根据复选框是否被选中来.toggle() div 的可见性：

$(function() {
    $('#mycheckbox').change(function() {
        var isChecked = $(this).is(':checked');
        $('#someDivId').toggle(isChecked);
    });
});

你可以在这里查看它的使用情况。

为了识别这个复选框，你可以给它分配一个唯一的id：

<%: Html.CheckBoxFor(m => m.Type, new { id = "mycheckbox" }) %>

或者一个类：

<%: Html.CheckBoxFor(m => m.Type, new { @class = "check" }) %>

然后调整你的jQuery选择器。

- Darin Dimitrov

---

我想问的是如何给复选框分配一个ID？我在使用ASP.Net中的CheckBoxFor，但我不确定如何设置这个ID。 - Cody

@Doctor Oreo，默认情况下，Html.CheckBoxFor助手会分配一个id。它将从视图模型对象层次结构中的lambda表达式推断出来。因此，如果我们在0级，则为id="Type"。当然，您可以通过使用CheckBoxFor助手的适当重载来自定义此内容，如我更新后的答案所示。 - Darin Dimitrov

由于某些原因，我必须勾选并取消勾选该框才能使函数()注册。 - Cody

@Doctor Oreo，更改事件只有在复选框的值发生更改时才会触发（如其名称所示）。 - Darin Dimitrov

Answer 2

是的，大多数HTML元素都有onclick/onchange事件。

假设您的复选框具有id="checkbox1"，您可以执行以下操作

var myCheckBox = document.getElementById("checkbox1");
myCheckBox.addEventListener('change', function(){do something}, false);

- Infinity

---

我的意思是如何给复选框分配一个ID？我正在使用ASP.Net中的CheckBoxFor，但不确定如何设置ID。 - Cody

Answer 3

请看这个问题：获取表单字段的生成客户端ID，这是我的答案：

我使用了这个帮助程序：

public static partial class HtmlExtensions
{
    public static MvcHtmlString ClientIdFor<TModel, TProperty>(
        this HtmlHelper<TModel> htmlHelper, 
        Expression<Func<TModel, TProperty>> expression)
    {
        return MvcHtmlString.Create(
              htmlHelper.ViewContext.ViewData.TemplateInfo.GetFullHtmlFieldId(
                  ExpressionHelper.GetExpressionText(expression)));
    }
}

像其他帮助程序一样使用它：@Html.ClientIdFor(model=>model.client.email)

或者在脚本中：

$(function() {
    $('#@Html.ClientIdFor(m=>m.Type)').change(function() {
        // Do stuff
    });
});

- John Landheer