validateForm firefoxでalertが表示されません

質問

java scriptについて質問です。

ホームページ内のプルダウンメニューで、項目が選択されていない状態で「submit」ボタンが押された場合、「～を選択してください」というメッセージを表示させたいと思います。

そこで以下のようなfunction validateFormを書いたのですが、alertがIEでは表示されるのにfirefoxでは表示されません。

function validateForm() {

if (document.form1.Prop1.options.value == 'Error') {
alert('Please select aaa.')
document.form1.Prop1.focus()
return false
}

if (document.form1.Prop2.options.value == 'Error') {
alert('Please select bbb.')
document.form1.Prop2.focus()
return false
}

if (document.form1.Prop3.options.value == 'Error') {
alert('Please select ccc.')
document.form1.Prop3.focus()
return false
}

if (document.form1.Prop4.options.value == 'Error') {
alert('Please select ddd.')
document.form1.Prop4.focus()
return false
}

if (document.form1.Prop5.options.value == 'Error') {
alert('Please select eee.')
document.form1.Prop5.focus()
return false
}

}

firefoxでもalertを表示させるには、どのようにすればいいでしょうか？
教えてくださいませ。よろしくお願いします。

回答No.2

yambejp · ベストアンサー

こんな感じで

<script language="javascript">
var list=new Object();
list.Prop1="aaa";
list.Prop2="bbb";
list.Prop3="ccc";
list.Prop4="ddd";
list.Prop5="eee";

function validateForm(f) {
for (var i=0;i<f.length;i++){
if(f[i].type=="select-one" && f[i].value=="Error"){
alert('Please select '+list[f[i].name]+'.')
f[i].focus()
return false
}
}
}
</script>
<form onSubmit="return validateForm(this)" action="javascript:alert('成功')">
aaa:
<select name="Prop1">
<option value="Error">せんたくして
<option value="1">データ１
<option value="2">データ２
<option value="3">データ３
</select><br>
bbb:
<select name="Prop2">
<option value="Error">せんたくして
<option value="1">データ１
<option value="2">データ２
<option value="3">データ３
</select><br>
ccc:
<select name="Prop3">
<option value="Error">せんたくして
<option value="1">データ１
<option value="2">データ２
<option value="3">データ３
</select><br>
ddd:
<select name="Prop4">
<option value="Error">せんたくして
<option value="1">データ１
<option value="2">データ２
<option value="3">データ３
</select><br>
eee:
<select name="Prop5">
<option value="Error">せんたくして
<option value="1">データ１
<option value="2">データ２
<option value="3">データ３
</select><br>
<input type=submit value="送信">
</form>

お礼

yambejpさんのスクリプトで、IEでもFirefoxでも問題なく動くようになりました。

ありがとうございました！

回答No.1

php504

optionsは配列なのでIEでも動かないような気がしますが
下記のフォームなら

<form name="form1" method="post" onSubmit="validateForm();">
<select name="Prop1">
<option value="Error">---
<option value="1">1
<option value="2">2
<option value="3">3
</select>
<input type="submit">
</form>

var i=document.form1.Prop1.selectedIndex;
if (document.form1.Prop1.options[i].value == 'Error') {
とするか単純に
if (document.form1.Prop1.value == 'Error') {
とすればどうでしょうか