javascriptがIEで機能しない

質問

ヘッダー内
<script language="JavaScript">
<!--
function view_ctrl() {
selectvalue = document.form1.select1.options[form1.select1.selectedIndex].value;
if(document.getElementById) {
document.getElementById("block1").style.display = "none";
if(selectvalue=="選択１"){
document.getElementById("block1").style.display = "block"
}
}
}
// -->
</script>

ボディー内
<form name="form1">
<select name="select1" onchange="view_ctrl()">
<option value="">選択してください</option>
<option>選択１</option>
<option>選択２</option>
</select>
</form>
<table><tr><td><div id="block1" style="display:block">表示</div></td></tr></table>

Firefox3.6ではうまく選択肢によって表示非表示にできたのですが、IE8では選択１を選択しても非表示のままです
どこを修正してやればいいでしょうか？
ぜひ御指南ください。

回答No.1

神崎 渉瑠（@taloo） · ベストアンサー

文字コードはUTF-8になっていますか？
valueではなくtextにすればどうでしょうか？
<option>にvalue属性を付与して、そちらで判断してみてはどうでしょうか？

お礼

早速の回答ありがとうございました。
value属性を持たせたら一発で解決できました。
POSTなどで送った場合、value属性なしなら自動的に値を取ってくれるので、javascript上でもそうなるものと勝手に思いこんでおりました。
ありがとうございました。

回答No.2

fujillin

私の環境ではfx3.6でも動きませんね。

原因は
＞selectvalue = document.form1.select1.options[form1.select1.selectedIndex].value;
の2番目のform1で要素の特定ができないようです。

IEの方は、HTMLのoptionにvalueが設定されていないのでvalue値がとれていない（→ ""として評価されている）ためと思われます。

両方を満たすために、optionにvalueを設定して、
<option value="selection1">選択１</option>
<option value="selection2">選択２</option>

function view_ctrl() {
var selectValue = document.forms["form1"].elements["select1"].value;
document.getElementById("block1").style.display = (selectValue=="selection1")?"block":"none";
}
みたいにするとどうでしょうか？

お礼

ありがとうございます。
value属性を持たせてないことが原因と解決に至りました。
御指南感謝します。