Question

为什么这不起作用？当我在"$(this).toggleClass('checked');"上更改alert('test')并点击标签时，我会看到提醒窗口： - /

$(document).ready(function(){
    $("label").click(function(){
        $(this).toggleClass('checked');
    });
});

<input type="radio" name="hours" id="hours1" value="xyz" style="display: none" />
<label for="hours1">10:00</label>
<input type="radio" name="hours" id="hours2" value="xyz" style="display: none" />
<label for="hours2">11:00</label>

Answer 1

请参阅此working code。我希望，它能满足您的需求

$(document).ready(function(){
    $("label").click(function(){
        if(!$(this).hasClass('checked')){
            $(this).addClass('checked');
        }else{
               $(this).toggleClass('checked');
        }
    });
});

<input type="radio" name="hours" id="hours1" value="xyz" style="display: block" />
<label for="hours1">10:00</label>
<input type="radio" name="hours" id="hours2" value="xyz" style="display: block" />
<label for="hours2">11:00</label>

Answer 2

假设您要做的是让当前所选复选框的标签具有“已检查”类：

http://jsfiddle.net/4pQt8/3/

注意：您需要优化$("label")选择器，因为现在它将从文档中的所有标签中删除选中的类。

$(document).ready(function(){
    $("input[name=\"hours\"]").change(function(){
        if ($(this).attr("checked")) {
            $("label").removeClass("checked");
            $("label[for=\"" + $(this).attr("id") + "\"]").addClass("checked");
        }
    });
});

将类添加到标签

2 个答案: