Question

我正在尝试创建一个可以更改网站字体的按钮。基本上，我只需要按钮来检查样式表是否存在，然后删除它，如果它存在，或者如果它没有被点击则添加它。

以下是我目前使用的代码（导致样式表被添加，然后在连续点击后重新读取）：

<script type="text/javascript">
if (jQuery('#opendyslexic').length) {
    jQuery('#opendyslexic-toggler').click(function() {
            jQuery('#opendyslexic').remove();
    });
}
else {
    jQuery('#opendyslexic-toggler').click(function() {
        jQuery('<link rel ="stylesheet" href="http://example.com/wp-content/css/opendyslexic.css" type="text/css" id="opendyslexic">').appendTo("head");
    });
};
</script>

因此，代码在添加样式表时是有效的，但它不会按预期删除样式表。

Answer 1

在这里，您可以在每次点击按钮时绑定多个事件。而只有一次点击事件。

此外，您还需要设置样式表的disabled属性，因为样式仍在内存中。这将是一个更好的主意，而不是删除和添加它。

jQuery('#opendyslexic-toggler').click(function() {
     var $styleSheet = jQuery('#opendyslexic');

     $styleSheet.prop('disabled') ?  $styleSheet.prop('disabled', false)  
                                  : $styleSheet.prop('disabled', true);
});

使用jQuery添加然后删除（然后添加）连续点击的样式表

1 个答案: