Question

我正在使用ASP.Net MVC处理Web App，并且HTML复选框元素存在问题。所以这是我的ViewModel for checkbox＆＃s;

public class ServiceViewModel:ViewModelBase
{
    public virtual string Name { get; set; }
    public virtual bool IsActive { get; set; }

}

我的观点是这样的：

        @model IList<Saloon.ViewModels.ServiceViewModel>

        <ul>
             @for (var i = 0; i < Model.Count; i++)
             {
                <li>
                    <input type="checkbox" class="chk" name="@Model.Name[i]" id="@(i+1)" />
                    <label for="@Model.Name[i]">@Model.Name[i]</label>
                </li>
             }
        </ul>

和我的JQuery代码，用于选中和取消选中复选框＆＃39; s：

<script>
$('input[type=checkbox].chk').click(function () {
    if ($(this).is(":checked")) {
        $(this).prop("checked", false);
    } else {
        $(this).prop('checked', true);
    }
});
</script>

但是这个JQuery代码不起作用。即使我已经尝试$('input[type=checkbox].chk').change(function () {... 以及我在互联网上找到的JQuery可用的其他一些方法，但这些方法也不起作用。

Answer 1

您的代码几乎在那里，但您遗漏了一件事，document.ready()

您的代码应该有效，更改复选框的状态没有任何问题。

相反，您的.click()无法正常启动，因为jQuery未完全加载。也许还有另外一个因素没有正确地解决事件，但这是我能从你提供的内容中猜出的。

<script>
$(document).ready(function() {
    $('input[type=checkbox].chk').click(function () {
        if ($(this).is(":checked")) {
            $(this).prop("checked", false);
        } else {
            $(this).prop('checked', true);
        }
    });
});
</script>

Answer 2

如果单击复选框，如果选中它表示已检查属性现在设置为true，然后检查条件是否已选中，将其设置为未选中，反之亦然，当然不会产生任何结果。将checked属性检查为true后，将checked属性设置为true，反之亦然。在这个实际例子中，这不会用于任何目的，因为您没有进行任何其他处理。

仅使用班级名称来完成工作。就像下面给出的那样

<script>
    $(function(){
        $('.chk').click(function () {
            if ($(this).is(":checked")) {
                $(this).prop("checked", true );
            } else {
               $(this).prop('checked', false );
            }
        });
    });
</script>

使用JQuery

2 个答案: