ここから本文です

<至急お願いいたします。ラジオボタンについて。> こんにちは。 メモ帳か...

non********さん

2010/11/516:39:25

<至急お願いいたします。ラジオボタンについて。>

こんにちは。

メモ帳からHTMLでホームページを作る際に
ラジオボタンを使いたいのですが

<form action="A.htm">
<input type="radio" name="url" value="A.htm">B(ラジオボタンの横に来る言葉(ページ名など))<br>
<br>
<form action="C.htm">
<input type="radio" name="url" value="C.htm">D(B同様。)<br>
<br>
<input type="submit" value="Go">

と、やってもラジオボタンは2つともできるのですが
「Go」を押したときにAのページへは何の問題もなく飛べるのですが
Bを選択して「Go」を押した際に、
Bページへは飛ばずにAページに飛んでしまいます。

どなたかわかる方がいましたら
よろしくお願いします。

わかりにくい説明で申し訳ありません(>_<)





HTMLについては詳しくわからないど素人なので
わかりやすい回答を頂けたら幸いです。

補足お答えいただきとてもありがたいのですが・・
どの部分を直したらよいのでしょうか・・?

本当に初心者のもので・・(泣)

申し訳ありません。。。

閲覧数:
273
回答数:
2
お礼:
50枚

違反報告

ベストアンサーに選ばれた回答

sak********さん

2010/11/523:37:02

サンプルではAなのに表示はB?でちょっとあっているかわからないのですが、
このような感じでしょうか? 違っていたらすみません。

<!DOCTYPE html>
<html lang="ja">
<head>
<title></title>
<style type="text/css">
li { list-style: none; }
</style>
<script type="text/javascript">
function go(event) {
var target = event.target || event.srcElement;
var urls = target.elements['url'];
for (var i = urls.length; i--; ) {
if (urls[i].checked) {
target.action = urls[i].value;
}
}
}
</script>
</head>
<body>
<form action="http://auone.jp/" onsubmit="return go(event);">
<ul>
<li><input type="radio" name="url" value="http://auone.jp/" checked="checked">au one</li>
<li><input type="radio" name="url" value="http://www.bing.com/">Bing</li>
<li><input type="radio" name="url" value="http://www.ytv.co.jp/conan/index.html">CONAN</li>
</ul>
<div><input type="submit" value="Go"></div>
</form>
</body>
</html>

この変更部分は次のとおりです。
・たぶん、2個目の<form>は不要です。ボタンが認識するformはひとつだけです。全体を1つの<form>~</form>でくくってください。
・formにonsubmit属性をつけます。ここからJavaScriptを呼び出します。
・上記のscriptを書きます。<head>~</head>内でも、<body>~</body>内でもかまいません。

質問した人からのコメント

2010/11/8 19:14:34

感謝 わかりやすい説明有難うございました(^O^)

ベストアンサー以外の回答

1〜1件/1件中

編集あり2010/11/516:56:07

<html>

<head>
<title>サイト名</title>

<script language="JavaScript">
function jump(){
var flag = 0;
for(i=0; i<document.forms[0].url.length; i++){
if(document.forms[0].url[i].checked){
flag = 1;
window.location.href = document.forms[0].url[i].value;
}
}
if(flag == 0){
alert('ラジオボタンが選択されていません。');
}
}
</script>

</head>

<body>
<form action="A.htm">
<input type="radio" name="url" value="http://a.htm">B(ラジオボタンの横に来る言葉(ページ名など))<br>
<br>
<form action="C.htm">
<input type="radio" name="url" value="http://c.htm">D(B同様。)<br>
<br>
<input type="submit" onClick="jump();" value="Go">
</form>
</body>

</html>

この質問につけられたタグ

みんなで作る知恵袋 悩みや疑問、なんでも気軽にきいちゃおう!

Q&Aをキーワードで検索:

Yahoo! JAPANは、回答に記載された内容の信ぴょう性、正確性を保証しておりません。
お客様自身の責任と判断で、ご利用ください。
本文はここまでです このページの先頭へ

「追加する」ボタンを押してください。

閉じる

※知恵コレクションに追加された質問は選択されたID/ニックネームのMy知恵袋で確認できます。

不適切な投稿でないことを報告しました。

閉じる