Question

我试图在选中复选框时将特定样式添加到文本中，并在未选中时将其删除，我已经设法弄清楚，代码并不漂亮，但结果都是那样的物。

问题是，这会干扰我的页面上的另一个功能，该功能是通过按钮激活的，所以我想要的是一个按钮功能，可以删除所有添加的样式。

我尝试了各种不同的方法，其中一个更接近的尝试是：

$("#off").click(function(){
  $("p").removeClass("classesadded");

}）;

这简单地打破了以前的功能。我认为问题不在于我试图让按钮删除样式的方式，而是首先添加样式的方式。我还尝试了一个功能，可以取消选中点击框，但是当盒子未经检查时，样式仍然存在。

无论如何，如果没有看到它就几乎不可能把头包起来，所以这里是一个小提琴：

http://jsfiddle.net/zwjz2h1x/1/

简而言之：我希望复选框添加/删除样式和按钮，只有在已经添加样式时才删除样式。

Answer 1

为什么不重复使用您的密码复选框？

试试这个 - ＆gt;

$('#toneclass').change(function(){
    toggle(this.checked)
});

function toggle(toggle)
{
    var c = toggle ? 'red' : '';
    $('.high').css('color', c);
    var c = toggle ? 'green' : '';
    $('.mid').css('color', c);
    var c = toggle ? 'yellow' : '';
    $('.low').css('color', c);

    var c = toggle ? 'underline' : '';
    $('.ob').css('text-decoration', c);

    var c = toggle ? '#0000FF' : '';
    $('.ob').css('-moz-text-decoration-color', c);

    var c = toggle ? '#0000FF' : '';
    $('.ob').css('text-decoration-color', c);

    var c = toggle ? '-1px -1px 0 black, 1px -1px 0 black, -1px 1px 0 black,1px 1px 0 black' : '';
    $('.high').css('text-shadow', c);

    var c = toggle ? '-1px -1px 0 black, 1px -1px 0 black, -1px 1px 0 black,1px 1px 0 black' : '';
    $('.mid').css('text-shadow', c);

    var c = toggle ? '-1px -1px 0 black, 1px -1px 0 black, -1px 1px 0 black,1px 1px 0 black' : '';
    $('.low').css('text-shadow', c);
}

//This doesn't work but I wish it did (it breaks the previous code)
//If class on turn off, If not do nothing
$("#off").click(function(){
 toggle(false);
});

http://jsfiddle.net/e2zht5az/1/

使用按钮删除添加的样式

1 个答案: