0

うまくいけば、ここで簡単な質問。私は次のhtmlコードを持っています：

<select id="dropdown">
  <option value="#00FFFF">Cyan</option>
  <option value="#FF00FF">Magenta</option>
</select>
<textarea style="background-color:[dropdown's selected value]">Sample Text</textarea>

ドロップダウンの選択に基づいて動的に変化するテキストエリアの背景色が欲しいです。CSSを使用してドロップダウンの値を参照する簡単な方法はありますか、それともJavaScriptがより良いルートですか？HTML5とCSS3は、ここでは間違いなく公正なゲームです。ありがとう！

4

2 に答える 2

3

ここ：デモ

<select id="dropdown">
  <option value="#00FFFF">Cyan</option>
  <option value="#FF00FF">Magenta</option>
</select>


<textarea>Sample Text</textarea>​

jqueryははるかに簡単

    $('#dropdown').change(function(){
       $('textarea ').css('background-color', $(this).val());
    });​
于 2012-11-23T06:26:17.397 に答える
0

これは HTML と CSS だけではできません。一部の JavaScript が必要です。例：

<select id="dropdown" onchange="setBg(this)">
  <option selected value="#FFFFFF">White</option>
  <option value="#00FFFF">Cyan</option>
  <option value="#FF00FF">Magenta</option>
</select>
<textarea id="ta">Sample Text</textarea>
<script>
function setBg(sel) { 
  document.getElementById('ta').style.background = 
     sel.options[sel.selectedIndex].value;
}
</script>
于 2012-11-23T08:20:23.480 に答える