0

テキスト入力にリンクされた JavaScript カラー ピッカーがあります。その色入力の更新時に色を変更するために、いくつかの色付き要素が必要です。各色 (青、赤、緑など) に 1 つずつ、複数のクラスを作成できますが、一部だけでなく、24 ビットのコロエ パレット全体が必要です。特定の CSS クラスに関連付けられたプロパティの値を変更することは可能ですか? はいの場合、これらの値を変更すると、レンダリングされたページにリアルタイムで新しい値が適用されますか? 前もって感謝します ：）

4

2 に答える 2

3

完全に可能です。はい、リアルタイムで更新されます。

これは、マウスオーバー イベントに関連付けられたクラス プロパティの更新を行う関数です (jQuery 1.0+ が必要です)。ID myDiv の div にマウスを合わせると、クラス myColorDivs のすべての div の CSS 背景色が白に更新されます。

$('#myDiv').mouseover(function() {

    $('.myColorDivs').css('background', '#fff');

});
于 2013-03-30T14:10:32.253 に答える
0

申し訳ありませんが、遅くなりました...数日前に同じ質問があり、実用的な答えが見つかりませんでした. これが私のためにそれを解決した方法です（jqueryが必要です）：

変更するクラスでページが必要とする可能性のある他のすべてのスタイルシートの後に、インライン スタイルシートを追加します。このスタイルシートに TITLE 属性を割り当ててください!

<style title="tomrulez" type="text/css">
/*the stylesheet to change - Note the TITLE*/
.shaded{
    color:green;
}
</style>

この関数を追加します。

    function modCSS (stylesheet, rule, attrib, newval){
    $.each( document.styleSheets, function( skey, svalue ) {
        if(svalue.title==stylesheet){
            $.each(svalue.cssRules,function (rkey,rvalue){
                if (rvalue.selectorText==rule){
                    rvalue.style[attrib]=newval;
                }
            });
        }
    });
  }

次のように呼び出します。

<div onclick="modCSS('tomrulez','.shaded','color','red')"> click here</div>

パラメータは次のとおりです。

  • stylesheet -> ページの最後のスタイルシートのタイトル
  • rule -> 変更したい CSS ルール
  • attrib -> 変更したいルールの属性
  • newval -> その属性に割り当てたい新しい値

これを Firefox、Chrome、IE10 でテストしました。古いバージョンでは IE が動作しない場合があります。しかし、私は主に少数のユーザー向けのバックエンドを開発していますが、彼らに言うと IE を使用していません (うん、私はそれについて幸運です!)

ところで。これが私のために働くプランカーです：http://plnkr.co/edit/EMDpjU06U2p83Df8Lolq?p=preview

于 2013-09-26T14:05:38.223 に答える