0

例https://stackoverflow.com/a/13104169/2465936に基づいて、そのような動作を作成したい:

フィドル: http://jsfiddle.net/rigaconnect/Ppbk5/17/

3 つのドロップダウン ボックス。ユーザーは最初のドロップダウン ボックスで値を選択します。たとえば、ユーザーが最初のドロップダウン ボックスでオプション 2 またはオプション 3 を選択すると、2 番目と 3 番目のドロップダウン ボックスの値が空白に変わります。<option value="4"></option>

ここにHTMLがあります

<select id="asset_id" name="asset[asset_id]">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4"></option>
</select>
<br />
<select id="country_id" name="material[country_id]">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4"></option>
</select>
<br />
<select id="country_id1" name="material1[country_id1]">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4"></option>
</select>

そして、ここにjavascriptがあります

<script type="text/javascript">

$(document).ready(function(){
var ddl1 = document.getElementById( 'asset_id' );
function updateCountry ( e ) {

var asset = this.options[ this.selectedIndex ].value, countryDDL= document.getElementById( 'country_id' ), country, i = countryDDL.options.length - 1;

switch ( asset ) {
case "2": country = 4;
break;
case "3": country = 4;
break;
}

for ( ; i > -1 ; i-- ) {
if ( countryDDL.options[i].value == country ) {
countryDDL.options[i].selected = true;
break;
}
}

}

ddl1.onchange = updateCountry;
});

</script>


<script type="text/javascript">

$(document).ready(function(){
var ddl2 = document.getElementById( 'asset_id' );
function updateCountry1 ( e ) {

var asset1 = this.options[ this.selectedIndex ].value, countryDDL1= document.getElementById( 'country_id1' ), country1, i = countryDDL1.options.length - 1;

switch ( asset1 ) {
case "2": country1 = 4;
break;
case "3": country1 = 4;
break;

}

for ( ; i > -1 ; i-- ) {
if ( countryDDL1.options[i].value == country1 ) {
countryDDL1.options[i].selected = true;
break;
}
}

}

ddl2.onchange = updateCountry1;
});

</script>

コード<option value="4"></option>は 1 つのドロップダウン ボックスでのみ変更されます。JavaScriptをコピーして貼り付け、変数と値を変更しただけです。何かが間違って行われました。そして、1 つの JavaScript コードでそれを行うことができます。

何が間違っているか教えていただけますか？

アップデート

回答に基づいて、そのようなコードを使用できます

function blank() {
if ( document.getElementById('assed_id').selectedIndex == 2 ) {
document.getElementById('country_id').selectedIndex=4;
document.getElementById('country_id1').selectedIndex=4;
}
}

ただし、ドロップダウンボックスがforeachでphp配列を使用して作成されている場合、javascriptを変更する方法を考える必要があります....

4

1 に答える 1

5

最初の選択オプション 変更時の方法を追加して空白にする 他の 2 つの選択オプション

<select id="asset_id" name="asset[asset_id]" onchange="blank(this.value)">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4"></option>
</select>

スクリプトの空白関数を追加して、他の選択オプションの値を設定します

<script>
function blank(ch)
{
    if(ch!=1)
    {
    document.getElementById('country_id').selectedIndex=4;
    document.getElementById('country_id1').selectedIndex=4;
    }  

}
</script>
于 2013-07-03T11:28:50.723 に答える