Jquery复选框选中并取消选中悬停答案

【问题标题】：Jquery checkbox check and uncheck on hoverJquery复选框选中并取消选中悬停
【发布时间】：2015-01-14 05:07:30
【问题描述】：

我正在使用 C# 代码动态创建复选框并将它们添加到占位符，我使用 Jquery 在鼠标悬停事件上选中/取消选中它们。

C#：

for (j = d; j < b; j++) {

    plhdr_seat.Controls.Add(new LiteralControl("<td>"));
    // CheckBox fg = new CheckBox();
    plhdr_seat.Controls.Add(new LiteralControl("<td>"));
    HtmlInputCheckBox cb = new HtmlInputCheckBox();
    cb.Attributes.Add("class", "mew");
    cb.Checked = true; // or cb.Checked = false;
    cb.ID = "check_" + j.ToString();
    plhdr_seat.Controls.Add(cb);

    plhdr_seat.Controls.Add(new LiteralControl("</td>"));
}

jquery:

<script>
    $(document).ready(function () {
        $(".mew").mouseover(function () {                
            var attr = $(this).attr("Checked");                               
            if (typeof attr !== typeof undefined && attr !== false)
            {
                $(this).prop('checked', false); // will check the checkbox with id check1                   
            }
            else {
                $(this).prop('checked', true); // will uncheck the checkbox with id check1                  
            }
        });
    });
</script>

我有这个。

悬停时复选框未选中。但是我再次将鼠标悬停在它们上，它们没有被检查。我无法确定问题所在。请帮帮我。

【问题讨论】：

标签： c# jquery html asp.net checkbox

【解决方案1】：

$(".mew").on("mouseover", function () {
    this.checked = ! this.checked;
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" class="mew" />

【讨论】：

这段代码在 stackoverflows 的编译器中运行良好。但不在我的视觉工作室中

【解决方案2】：

您可以使用.hover() 将其简化为：

$(".mew").hover(function() {
  $(this).prop("checked", !$(this).prop("checked"));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" class="mew" />

参考文献

.prop()

【讨论】：

【解决方案3】：

尝试使用.on

例如，如果<div id="fixed_static"> 是包含所有checkbox 的div

试试这个

$("#fixed_static").on("mouseover",".mew",function(){


});

或者你可以使用

$("html").on("mouseover",".mew",function(){


    });

【讨论】：

【解决方案4】：

试试这个，

$(document).on("mouseover",".mew",function(){
    this.checked = !this.checked;// check if uncheck, uncheck if checked
    //$(this).prop('checked',!this.checked); in jquery
});

【讨论】：