私はここに来たばかりで、ジュニア開発者です。IE8 には 1 つの問題があります。私のコードは Firefox では問題なく動作しますが、IE ではまったく動作しません。
私のコードには 2 つの複数選択があり、最初の選択の 2 番目の選択のいくつかのオプションを表示したいと考えています。
HTML:
<form name="formMenu">
<table>
<tr>
<td align="center">
<select multiple name="selectOne" title="selectOne" class="selectOne"
style="width:180px;height:60px">
<option value="abc" onclick="Javascript:obtainSecondChoices()">
abc
</option>
<option value="def" onclick="Javascript:obtainSecondChoices()">
def
</option>
</select>
</td>
</tr>
<tr>
<td align="center">
<select multiple name="selectTwo" title="selectTwo" class="selectTwo"
style="width:180px;height:60px">
<option class="abc" value="selTwoOpt1" style="display:none;">
selTwoOpt1
</option>
<option class="def" value="selTwoOpt2" style="display:none;">
selTwoOpt2
</option>
<option class="abc" value="selTwoOpt3" style="display:none;">
selTwoOpt3
</option>
</select>
</td>
</tr>
</table>
</form>
Java スクリプト:
function obtainSecondChoices(){
var fstSelects = document.formMenu.selectOne;
for(var i = 0 ; i < fstSelects.length; i++){
var fstSelect = fstSelects[i];
if(fstSelect.selected){
var scndSelects = document.formMenu.selectTwo;
for(var j = 0; j< scndSelects.length; j++){
if(scndSelects[j].className == fstSelect.value){
scndSelects[j].style.display = '';
}
}
} else {
var scndSelects = document.formMenu.selectTwo;
for(var j = 0; j< scndSelects.length; j++){
if(scndSelects[j].className == fstSelect.value){
scndSelects[j].style.display = 'none';
scndSelects[j].selected = false;
}
}
}
}
}
これにより、最初のオプションで選択した内容に応じて、2 番目の選択肢が表示または非表示になり、選択が解除されます。
先ほど言ったように、Firefox では問題なく動作しますが、Internet Explorer は最初に display: none; で非表示にすることさえできません。
事前に感謝し、私の下手な英語で申し訳ありません.