jqueryで実装された色と背景を変更するコードchange(fontsize,background)Supplement 2_jquery

change(fn)
一致する各要素の変更イベントにハンドラー関数をバインドします。
change イベントは、要素がフォーカスを失ったとき、およびフォーカスを取得した後に値が変更されたときにもトリガーされます。

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>プライド</title> <style> p{line-height:23px;margin:0;padding:0;} </style> <h4> </h4> <h4>変更(fn)</h4> <h4>一致する各要素の変更イベントにハンドラー関数をバインドします。 </h4> <div id="c-obj">change イベントは、要素がフォーカスを失ったとき、およびフォーカスを取得した後に値が変更されたときにもトリガーされます。 <label for="font-size"> </label> <select name="" id="font-size">フォントサイズ<option value="12px"> </option> <option value="14px">小さいサイズ</option> <option value="16px">小さい</option> <option value="18px">中</option> <option value="24px">大きい</option> </select>大<label for="background"> </label> <select name="" id="background">背景色<option value="#F4FBFF"> </option> <option value="gray">デフォルト</option> <option value="red">ライトグレー</option> <option value="green">赤</option> <option value="yellow">緑</option> </select>明るい黄色<label for="color"> </label> <select id="color">フォントの色<option value="#000"> </option> <option value="#f00">ブラック</option> <option value="#060">赤</option> <option value="#00f">緑</option> <option value="#600">ブルー</option> </select>ブラウン<label> </label> </div> <h4> </h4> <p>春の川の花月夜</p> <p>川の春の潮が海面に達し、明るい月が海に昇ります。きらめく波は何千マイルも波を追いかけますが、春の川にはどこにも月はありません。 </p> <p>方店の周りには川が流れ、月明かりが花や森を雪の結晶のように照らします。空には知らず知らずのうちに霜が舞い、東屋の白い砂は見えない。 </p> <p>川も空も塵ひとつなく、明るい空には月だけがぽつんと浮かんでいます。川のほとりで初めて月を見た人は誰ですか?蒋岳が人々を照らしたのはいつですか? </p> <p>人生は世代から世代へと無限ですが、川と月は毎年同じだけです。蒋岳が誰を待っているかは分かりませんが、長江が水を送っているのが見えます。 </p> <p>白い雲が消えていき、清風浦は悲しみに満ちています。今夜浮気しているのは誰の家族ですか?明月塔が恋しいのはどこですか? </p> <p>かわいそうな月が二階をさまよっている、化粧鏡から離れて輝いているはずだ。翡翠のドアカーテンは巻き取ることができず、金床で衣服を叩き、ブラシで擦ると戻ってきます。 </p> <p>この瞬間、私たちはお互いを見ていますが、お互いの声は聞こえません。月の光があなたを照らすことを願っています。雁は長く速く飛び、魚や龍は水に飛び込みます。 </p> <p>昨夜、池に花が散る夢を見たので、春の真ん中に家に帰れなかったのが残念でした。川の湧き水はなくなり、月は再び西に沈みました。 </p> 傾いた月は海霧を隠し、街市と小祥への道は果てしなく続きます。月までにどれだけの人が戻ってくるかわかりません。落ちる月が愛に満ちて川のあちこちの木々を揺らします。
[Ctrl A すべて選択 注:

外部 Js を導入する必要がある場合は、更新して実行する必要があります
]色と背景を変更するための Jquery change(fontsize,background) コード<script> $(function(){ $('#c-obj select').change(function(){ alert($(this).attr('id') + ': ' + $(this).val()); $('p').css($(this).attr('id'), $(this).val()); //select的ID和要设置的CSS属性值必须保持一致 }); }); </script>