- PR -

JavaScriptについて

1
投稿者投稿内容
未記入
ベテラン
会議室デビュー日: 2005/08/05
投稿数: 76
投稿日時: 2005-11-08 14:24
超初歩的質問で申し訳ないのですが
1、<INPUT type="radio" name="H1" value="a">
2、<INPUT type="radio" name="H2" value="a">
3、<INPUT type="radio" name="H1" value="b">
4、<INPUT type="radio" name="H2" value="b">

というHTMLの記述があり、ラジオボタンが4つある状態で
見た目上、

1 2
3 4

といった感じで並べられています。
今現在、1と2の両方にチェックを入れることができ、
3と4の両方にチェックを入れることができます。
(1と3の両方や、2と4の両方にチェックを入れることはできません。)
このような状態で、1と2の両方、または3と4の両方に
チェックを入れてしまったとき、エラーメッセージを表示して
Submitボタンを押せなくすることってJavaScriptでできそうですが
どのようにすれば良いかわかりません。

申し訳ありませんがお教え下さい。
よろしくお願い致します。
mio
ぬし
会議室デビュー日: 2005/08/25
投稿数: 734
お住まい・勤務地: 神奈川県
投稿日時: 2005-11-08 15:10
submitボタンをやめて、ふつうのtype="button"でfunctionを呼ぶ。
H1.valueとH2.valueが同じかどうか調べる。
同じであれば、エラーメッセージを表示して戻る。
違っていれば、formをsubmitする。
未記入
ベテラン
会議室デビュー日: 2005/08/05
投稿数: 76
投稿日時: 2005-11-08 15:35
<SCRIPT language="JavaScript">
<!--
function Check(){
if(document.myform.H1.value=="a"){
alert("1つめと2つめは違うものを選んで下さい。");
return false;
}
document.myform.submit()
return true;
}
// -->
</SCRIPT>

このようなJavaScriptを書いてみました。
これで、1か3で「a」を選んだらエラーメッセージが出ると思ったのですが
普通に登録されてしまいました。
条件の書き方がまずいのでしょうか。

また、条件文のところで
if(document.myform.H1.value==document.myform.H2.value){

としたところ、例えば1と2でエラーメッセージが出るのは嬉しいのですが
1と4でもエラーメッセージが出てしまうのです。
要するに全てにおいてエラーメッセージが出てしまうという状態でした。

条件文についてお教え下さい。
mio
ぬし
会議室デビュー日: 2005/08/25
投稿数: 734
お住まい・勤務地: 神奈川県
投稿日時: 2005-11-08 15:47
あー、すみません、そのまま使うとだめです。
H1とH2はそれぞれ配列なので、checked==trueの側のvalueを使う必要があります。

with (document.myform) {
if(H1[H1[0].checked?0:1].value==H2[H2[0].checked?0:1].value){

とか。
mio
ぬし
会議室デビュー日: 2005/08/25
投稿数: 734
お住まい・勤務地: 神奈川県
投稿日時: 2005-11-08 15:49
if((H1[0].checked && H2[0].checked)||(H1[1].checked && H2[1].checked)) {
よく考えたらこっちのほうが分かりやすいですね。
未記入
ベテラン
会議室デビュー日: 2005/08/05
投稿数: 76
投稿日時: 2005-11-08 15:55
mio様

重ね重ねすいません。
右も左もわからない状態で申し訳ないのですが
書いていただいた条件文をそのままコピペしたところ
H1は宣言されていませんというエラーが出てしまいました・・・。
ちなみに今は

<SCRIPT language="JavaScript">
<!--
function Check(){
if((H1[0].checked && H2[0].checked)||(H1[1].checked && H2[1].checked)) {
alert("1つめと2つめは違うものを選んで下さい。");
return false;
}
document.myform.submit()
return true;
}
// -->
</SCRIPT>

となっています。

未記入
ベテラン
会議室デビュー日: 2005/08/05
投稿数: 76
投稿日時: 2005-11-08 16:01
すいません!下記のようにしたらできたみたいです!!
ありがとうございました。

<SCRIPT language="JavaScript">
<!--
function Check(){
if((document.myform.H1[0].checked && document.myform.H2[0].checked)||(document.myform.H1[1].checked && document.myform.H2[1].checked)) {
alert("1つめと2つめは違うものを選んで下さい。");
return false;
}
document.myform.submit()
return true;
}
// -->
</SCRIPT>
ぼのぼの
ぬし
会議室デビュー日: 2004/09/16
投稿数: 544
投稿日時: 2005-11-08 16:10
ちなみに、submitボタンを使う場合は、Formタグに

 onsubmit="return Check();"

と書いた上で、Check()から

 document.myform.submit();

の一行を外すとうまくいくはず。
1

スキルアップ/キャリアアップ(JOB@IT)