お世話になります。
フォームについての質問なんですが、例えば、↓のようなフォームがあったとします。
<form>
<input type="radio" name="sample" value="同意する">同意する
<input type="radio" name="sample" value="同意しない">同意しない
<input type="button" value="同意して申し込む" onClick="location.href='http://www.google.co.jp/'">
</form>
このフォームは「同意する」「同意しない」の選択にかかわらず、「同意して申し込む」をクリックすればgoogleのトップページが開きます。これを、「同意する」を選択していないと、googleのトップページが開かないようにしたいのです。「同意しない」が選択されていたら、動作しないようにしたいです。分かりにくい説明かもしれませんが、どうぞよろしくお願いします。
No.3ベストアンサー
- 回答日時:
#1です。
2番さんの指摘があったので少々ソースを変えました。
ちなみに補足するとHTMLではフォームに名前をつけてもかまいませんがXHTMLだとダメです。
だから非推奨と言うことになっています。
そのかわり、フォームには、idをつけることは認められていて
代わりに以下のように出来ます。
ちなみに、javascriptを使用したタグは現在携帯では使えません。
<form id="formname">
<input type="radio" name="sample" value="同意する">同意する
<input type="radio" name="sample" value="同意しない">同意しない
<input type="button" value="同意して申し込む" onClick="
if( document.getElementById('formname').sample[0].checked ){
alert('同意したのでグーグルページへいきます。');
location.href='http://www.google.co.jp/';
}else if( document.getElementById('formname').sample[1].checked ){
alert('同意しなかったのでヤフーページへいきます。');
location.href='http://www.yahoo.co.jp/';
}else{
alert('同意するか、同意しないのどちらかを選択してね');
}
">
</form>
回答ありがとうございます。
お陰様で、自分の思うようにいきました。
携帯では使えないとのことなので、ラジオボタンをなくし、通常のボタンにリンクを設定することで対処しました。
本当にどうもありがとうござました<(_ _)>
また、困ったことがあったらお助け下さい。それでは。
No.2
- 回答日時:
formにnameをつけるのは非推奨
こんな風にしてみてください
<form>
<input type="radio" name="sample" value="同意する" onclick="this.form.google.disabled=false" id="sample_yes"><label for="sample_yes">同意する</label>
<input type="radio" name="sample" value="同意しない" onclick="this.form.google.disabled=true" id="sample_no"><label for="sample_no">同意しない</label>
<input type="button" id="google" value="同意して申し込む" onClick="location.href='http://www.google.co.jp/'" disabled>
</form>
回答して頂いてどうもありがとうございます。
返事が遅くなって申し訳ありません。
なるほど、同意するを選択している時は「同意して申し込む」がクリックできて、していない時はクリックできない。これは便利ですね。ですが、同意するを選択した状態で「同意して申し込む」をクリックしても反応しません。私の間違いだったら申し訳ないです。
それから、このフォームタグは携帯でも使えるのでしょうか?
お手数ですが、どうぞよろしくお願いします。
No.1
- 回答日時:
<form name="formname">
<input type="radio" name="sample" value="同意する">同意する
<input type="radio" name="sample" value="同意しない">同意しない
<input type="button" value="同意して申し込む" onClick="
if( document.formname.sample[0].checked ){
location.href='http://www.google.co.jp/';
}else{
location.href='http://www.yahoo.co.jp/';
}
">
</form>
上の例では、同意を選択しているときはgoogle 同意しないを選択しているときは、yahooに行くようになっています。
説明すると
まずフォームに名前をつけます。
<form name="formname">
次にRADIOぼたんがありますが、そのまま
<input type="radio" name="sample" value="同意する">同意する
<input type="radio" name="sample" value="同意しない">同意しない
としていますが、valueは別に設定しなくてもいいでしょう。
次にonclick時の処理ですが
if( document.formname.sample[0].checked ){
もし、 document(ホームページの) formname(というフォームの)sample(というコントロール、ボタンやエディット等)[0]というのは、0番目、一番最初がチェックされていたらという意味です。
なぜ[0]がいるかというと sampleという名前のボタンが二つあるからです。
で[0]で最初の同意するという部分だけ調べています。
気づいたと思いますが、このスクリプトだと、同意するも、同意しないもチェックされていないとき、同意しないの処理になります。
何も押してないなら、押せとメッセージを表示する為には、下記のようになります。
if( document.formname.sample[0].checked ){
//0番目のsampleがチェックされている場合ここの処理が行われます。
location.href='http://www.google.co.jp/';
}else if( document.formname.sample[0].checked ){
//1番目のsampleがチェックされている場合ここの処理が行われます。
location.href='http://www.yahoo.co.jp/';
}else{
//それ以外、すなわち、0番目も1番目もチェックされていない状態
alert('同意するか、同意しないのどちらかを選択してね');
}
回答して頂いてどうもありがとうございます。
返事が遅くなって申し訳ありません。
助言してくれた通りフォームタグを打ち込んで、サーバー上にUPして確認してみましたが、「同意して申し込む」をクリックしても反応しません。私の間違いだったら申し訳ないです。
それから、このフォームタグは携帯でも使えるのでしょうか?
お手数ですが、どうぞよろしくお願いします。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- JavaScript javascript作成してます。ラジオボタンで判定するコードを書いてます。 1 2023/07/18 11:03
- HTML・CSS ただいま勉強始めたての初心者です。フォームを縦並べにしたいです。 2 2022/11/20 17:18
- JavaScript フォームが空欄の時にフォームの外をクリックすると、エラーが出るコードを調べています。 1 2023/06/25 11:51
- JavaScript Javascript初心者|jQueryの.val()で値を取得し複数の要素を連結させる方法知りたい 2 2022/06/02 12:06
- JavaScript sessionStorageを調べています。 1 2023/06/20 12:41
- JavaScript javascriptのちょっとした動作不良(原因は突き止めたのですが) 1 2023/06/15 19:58
- PHP 入力した部分を表示させたまま(保持)するにはどうすれば良いでしょうか? 1 2023/01/25 11:14
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- PHP PHPで画像の渡しが上手く行きません。 1 2023/02/02 09:39
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
HTMLボタンの文字色を変え...
-
SUBMITボタンを表示させないでS...
-
getParameterで値が取得できず...
-
リンクでPOSTデータを送信する...
-
input button の文字の色を2色...
-
htmlで画面遷移させたい
-
htmlでsubmit送信時、actionよ...
-
submitボタンにvalue属性の値で...
-
checkboxとlabelがずれる
-
ASP.NET ブラウザでボタンが表...
-
INPUTのボタン周囲のスペース
-
formの送信ボタンをテキストに...
-
HTMLだけでボタン作成
-
戻ると、記入フォームの内容が...
-
[html]<input type="file">タグ...
-
HTMLのボタンで他サイトへ...
-
コネクション・セッション・ト...
-
Accessの画面更新を一時的に停...
-
PHPからWindowsログインユーザ...
-
複数選択のListBoxでClickイベ...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
HTMLボタンの文字色を変え...
-
checkboxとlabelがずれる
-
submitボタンにvalue属性の値で...
-
ボタンをクリックした時に、入...
-
getParameterで値が取得できず...
-
SUBMITボタンを表示させないでS...
-
リンクでPOSTデータを送信する...
-
ボタンのなかに表示する文字を...
-
UWSC
-
グーグルマップの文字化けで困...
-
HTMLだけでボタン作成
-
<FORM> </FORM> の中に さらに...
-
INPUTのボタン周囲のスペース
-
ボタンリンクの文章を二行に・・・
-
inputのtextとsubmitの高さがズ...
-
ボタンを押さずにボタンを押す...
-
戻ると、記入フォームの内容が...
-
formの送信ボタンをテキストに...
-
どのボタンが押されたかの判定
-
ただいま勉強始めたての初心者...
おすすめ情報