プロが教えるわが家の防犯対策術!

初めまして。

診断サイトのテスト画面を作成しております。
2問×4ページ+結果1ページの構成です。

1ページの中にラジオボタンを使用した4択問題×2問あり、
ページ下部に「次へ」のボタンを配置しています。
その「次へ」ボタンを押す際に、
未選択のラジオボタンがある場合にアラートがあがり、
(「次へ」ボタンは画像)
かつ選択済みの場合は次のページへリンクする、
という仕様にしたいのですが、
何から設定したらよいのか迷走してしまっております…

<input type="image">に対してリンクを設定してみようと色々やってみたのですがうまくいかず、
参考サイトから引用してきたりもしているのですが、
アラートだけ設定できてもリンクか画像表示ができない、、と
あっちをたてればこちらがたたずという状況です。

ちなみにテスト画面なので、
ラジオボタンの数値等は無視してOKです。
【「次へ」ボタンを押すときにページ内未選択のものがある場合アラートがあがる/「次へ」ボタンを押すと次のページに移動する(リンク)】の状態が実現できれば、
書き方等に特にこだわりはありません。

また、javascriptは今回始めて触れているような状況で、
わかりにくかったら申し訳有りません。。
そもそもjavascriptが適切なのかも不明な状態です。

何卒よろしくお願い致します。

A 回答 (1件)

こういうこと?



<script>
function check(f){
var r={};
for(var i=0;i<f.length;i++){
if(f[i].type=="radio"){
if(typeof(r[f[i].name])=="undefined") r[f[i].name]=false;
if(f[i].checked) r[f[i].name]=true;
}
}
for(var i in r){
if(r[i]==false){
alert("未チェックあり!");
return false;
}
}
return true;
}
</script>
<form onsubmit="return check(this)">
<p>
Q1:
<input type="radio" name="q1" value="1">1
<input type="radio" name="q1" value="2">2
<input type="radio" name="q1" value="3">3
<input type="radio" name="q1" value="4">4
</p>
<p>
Q2:
<input type="radio" name="q2" value="1">1
<input type="radio" name="q2" value="2">2
<input type="radio" name="q2" value="3">3
<input type="radio" name="q2" value="4">4
</p>
<p>
<input type="image" src="next.jpg">
</p>
</form>
    • good
    • 0

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!