1

class="red"CSSスイッチャーを作成したのですが、 forで要素だけを変更する必要がありbodyます。どうすればいいですか？

<html>
    <head>
        <jdoc:include type="head" />
        <link href="style.css" rel="stylesheet" type="text/css" />
        <script src="/js/modernizr-2.0.6.custom.min.js"></script>
        <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
        <script src="/js/jquery.cookies.2.2.0.min"></script>
    </head>
    <body class="front">
        <select class="style-change">
            <option value="red">Red</option>
            <option value="blue">Blue</option>
            <option value="green">Green</option>
        </select>
        <script>
            $(function(){
                $('.style-change').change(function(){
                    $('link[rel="stylesheet"]')
                        .attr("href", $(this).val() + ".css");
                });
            });
        </script>
    </body>
</html>

デモHere

4

3 に答える 3

1

これを使用して、ボディのクラスを変更できます。

document.body.className="red"
于 2013-08-29T14:13:58.437 に答える
0

ストレートなJavaScriptを好む場合は、Moazzamの答えがうまくいくはずです。jQuery を使用したい場合は、これを使用できます。

$('body').removeClass().addClass('red');

または、ドロップダウンで使用するために一般化するには、次のようにします。

$(function(){
    $('.style-change').change(function(){
        $('body').removeClass().addClass($(this).val());
   });
});
于 2013-08-29T14:20:48.200 に答える
0

body タグ クラスを変更するだけの場合は、jquery 関数を更新します。

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

http://jsfiddle.net/mF9qm/

于 2013-08-29T14:25:43.200 に答える