1

テキストの代わりに画像を含む選択ボックスで作業しています(背景にcssを使用)。

<script type="text/javascript">
function onChange(element) {
element.style.backgroundColor = "Yellow";
element.className = "on_change";
}
</script>



<select onchange="onChange(this);">
<option value="1" style="background: url(/one.png) no-repeat scroll 0 0 transparent; width:32px; height:32px;"></option>
<option value="2" style="background: url(/two.png) no-repeat scroll 0 0 transparent; width:32px; height:32px;"></option>
<option value="3" style="background: url(/three.png) no-repeat scroll 0 0 transparent; width:32px; height:32px;"></option>
</select>

問題は、選択したオプションの値を取得する方法です。1の場合は1つの画像を設定し、2の場合は純粋なjavascript(jQueryなし)を使用して別の画像を背景として設定しますか?

selectedIndexそれが私の問題の鍵であることは知っていますが、それをどのように使用するか、またはif elseステートメントでどのように使用するかについてはわかりません。

上記のスクリプトは私の試行の1つにすぎません。実際には、上記のスクリプトを使用して同じタスクを実行しています。

<select onchange="this.style.backgroundColor=this.options[this.selectedIndex].style.backgroundColor; this.style.color=this.options[this.selectedIndex].style.color">
4

1 に答える 1

1

これが実際の例です。http://codebins.com/codes/home/4ldqpb9

それ以外の場合は必要ありませんが、selectedIndexに基づいて背景画像を変更するだけです。

function onChange(obj) {
    obj.style.backgroundImage = obj.options[obj.selectedIndex].style.backgroundImage
}
于 2012-07-07T03:09:18.020 に答える