Question

我希望复选框更改事件为我的示例文字加下划线。然而，它不起作用。我添加了一个小提琴。

$(document).ready(function() {
    $('.checkbox').change(function(){
        if (this.checked) {
            $('.text').css('text-decoration', 'underline')
        }
        else {
            $('.text').css('text-decorationr', 'none')
        }
        }) 
    });
});

http://jsfiddle.net/JsUWv/731/

Answer 1

选择器错误：$('.checkbox1')应为$('#checkbox1')。

$(document).ready(function() {
    $('#checkbox1').change(function(){
        if (this.checked) {
            $('.text').css('text-decoration', 'underline')
        }
        else {
            $('.text').css('text-decoration', 'none')
        }
        }) 
    });

演示： http://jsfiddle.net/JsUWv/720/

稍后编辑： 如果您需要，这是CSS唯一的方法：http://jsfiddle.net/JsUWv/732/

#checkbox1:checked + .text{
    text-decoration:underline;
}

PS：我想知道如何修改720

Answer 2

您过早地关闭了.text DIV，在JavaScript中有一组额外的括号，调用错误的checkbox选择器（“#checkbox”，用于ID），以及错误拼写“文本装饰“在else有条件的...看一看并比较。

http://jsfiddle.net/JsUWv/723/

复选框更改事件即时更改文本下划线

2 个答案: