0

次のコードを使用して、TH 行のテキストの色を変更したいテーブルがあります。

<select>
  <option onclick="document.getElementById('tablehead').style.color=''">Default</option>
  <option onclick="document.getElementById('tablehead').style.color='red'">Red</option>
  <option onclick="document.getElementById('tablehead').style.color='yellow'">Yellow</option>
  <option onclick="document.getElementById('tablehead').style.color='green'">Green</option>
</select>

これは Firefox と同じように完全に機能しますが、他のブラウザーでテストすると機能しません。ここで何が欠けていますか？

4

3 に答える 3

1

jQuery を使用している場合は、変更イベントをリッスンできます。

$('select').on('change', function() {
   $('#tablehead').css('color', this.value.toLowerCase());
});
于 2013-10-12T12:16:45.990 に答える
0

ネイティブ JavaScript の使用

<select onchange="document.getElementById('tablehead').style.color=this.value">
  <option value=''>Default</option>
  <option value='red'>Red</option>
  <option value='yellow'>Yellow</option>
  <option value='green'>Green</option>
</select>
<div id="tablehead">tablehead</div>

デモ:フィドル

于 2013-10-12T12:20:55.683 に答える
0

onChange代わりにあなたのイベントを監視する必要があります。selectこれには、あなたのに追加する必要がありvalueますoptions。ユーザーがオプションをクリックして値を選択するとは限りません。ご覧のとおり、すべてのブラウザーがクリック イベントを発生させるわけではありません。

擬似コード:

<select onChange="if (this.options[this.selectedIndex].value == 1) { red } else if (this.options[this.selectedIndex].value == 2) { green }">
于 2013-10-12T12:18:47.373 に答える