javascript - 菜单的 CSS 正文切换器

Question

我需要帮助..我改变了身体标签类：

<body class="front">
<select class="style-change">
<option value="green">Green</option>
<option value="red">Red</option>
<option value="blue">Blue</option>
 </select>


<script>
$('.style-change').change(function(){
    $('body').removeClass();
    $('body').addClass($(this).val());
});

</script>

但我需要更改然后我点击菜单 - 更改正文样式和其他菜单元素....然后我点击菜单我想更改菜单和红色绿色或蓝色身体的类“前”

score 0 · Accepted Answer

尝试：

$('.style-change').change(function(){
    var color = $('option:selected',this).val();
    $('body').removeClass().addClass(color);
});

score 0 · Accepted Answer

首先从正文标签中删除所有类，然后应用新类。

<script>
$('.style-change').change(function(){
    $('body').removeAttr('class');
    $('body').attr('class', $('.style-change option:selected').val());
});
</script>

score 0 · Accepted Answer

$('select.style-change').change(function() {
    var selectedColor = $(this).find('option:selected').val();
    $('body').removeClass().addClass(selectedColor);
});

score 0 · Accepted Answer

您需要将 jQuery 脚本包含在 document.ready 中：

$(function() {
     $('.style-change').change(function(){
    $('body').removeClass();
    $('body').addClass($(this).val());
});

  });

演示

javascript - 菜单的 CSS 正文切换器

4 回答 4

Related

Reference