0

<option>選択した要素に応じて異なる動作が必要です。

<select name="colorSelector" onchange="handleColorChange();">
    <option value="">- select -</option>
    <option value="1">Red</option>
    <option value="2">Blue</option>
</select>

function handleColorChange() {
    // Behave different depending on which <option> was just selected
}

これを実現するには、リスナーhandleColorChange()内からメソッドに何を渡す必要がありますか?onchange

4

5 に答える 5

2

まだ誰も言及していないようswitchです。また、HTML に関数を入れないでください。それは悪いことです。正しい方法は次のとおりです。

document.getElementsByName( 'colorSelector' )[ 0 ].onchange = function ( ) {
    switch ( this.options[ this.selectedIndex ].value ) {
        case '1':
            // Do something when "Red" is selected
            break
        case '2':
            // Do something when "Blue" is selected
            break
    }
}
于 2012-04-19T17:05:19.913 に答える
1

試す

function handleColorChange(self)
{
   console.log(self.selectedIndex);
   console.log(self.options[self.selectedIndex].text);
   console.log(self.options[self.selectedIndex].value)
};

そしてHTMLコードで

<select id="mySelect" name="colorSelector" onchange="handleColorChange(this);">
于 2012-04-19T16:52:38.390 に答える
0 
<select name="colorSelector" onchange="handleColorChange(this);">
    <option value="">- select -</option>
    <option value="1">Red</option>
    <option value="2">Blue</option>
</select>​


function handleColorChange(obj) {
    alert(obj.options[obj.selectedIndex].value);
}​

JSFiddleはこちら

于 2012-04-19T16:52:38.853 に答える
0

機能するために何も渡す必要はありません。選択する ID を割り当てるだけです。

<select id="mySelect" name="colorSelector" onchange="handleColorChange();">
    <option value="">- select -</option>
    <option value="1">Red</option>
    <option value="2">Blue</option>
</select>

function handleColorChange() {
var x=document.getElementById("mySelect").selectedIndex;
var y=document.getElementById("mySelect").options;
alert("Index: " + y[x].index + " is " + y[x].text);
}

または、名前で取得したい場合は、関数で次のようにします。

var x=document.getElementsByName("colorSelector")[0].selectedIndex;
var y=document.getElementsByName("colorSelector")[0].options;
alert("Index: " + y[x].index + " is " + y[x].text);
于 2012-04-19T16:48:11.520 に答える
0

使用するthis

<select name="colorSelector" onchange="handleColorChange(this);">
    <option value="">- select -</option>
    <option value="1">Red</option>
    <option value="2">Blue</option>
</select>

function handleColorChange(element) {
    // Behave different depending on which <option> was just selected
}
于 2012-04-19T16:50:58.140 に答える