WEB相談室

Webページ作成に関しての何でも掲示板です。

タイトル:コンボボックスについて

0:[投稿] ラムラム [MAIL] [2002/09/10 17:25 ][環境:WIN+IE WIN系+Java]

コンボボックスをプルダウンして中の項目を選び、クリックをしたときに、その項目の内容が他のコンボボックスに表示されるというJavaScriptが分かりません。
初心者なものでしてσ(^_^;)アセアセ...
<HTML><HEAD>
<TITLE></TITLE>
</HEAD>
<BODY><P>
<SCRIPT LANGUAGE="JavaScript">
var GzKb=new Array( 1, 8, "区分1", 2, 10, "区分2",);
var GzIf=new Array( 1, 8, 12, "名前1_1", 2, 8, 12,"名前1_2", 3, 10, 16, "名前2_1", 4, 10, 16, "名前2_2",);
</SCRIPT>
<B>区分</B>
<SELECT NAME="strkubunn" MCLASS=FormPart>
<OPTION>
<OPTION VALUE="1">区分1
<OPTION VALUE="2">区分2
</SELECT>
<B>名前</B>
<SELECT NAME="strNamae" MCLASS=FormPart>
<OPTION>
<OPTION VALUE="1">名前1_1
<OPTION VALUE="2">名前1_2
<OPTION VALUE="3">名前2_1
<OPTION VALUE="4">名前2_2
</SELECT>
</BODY>
</HTML>
ちなみに、このまま走らせたらいきなりエラーが出ちゃいます。(^ー^;)
もう、パニくっています!Σ(;^□^A
誰か〜!o( ´O`)o


1:[回答] ぱんだ [2002/09/10 17:54 ]

目的とした動作がちょっとよくわからないのですが、
エラーがでるのは以下が原因ですね。

>var GzKb=new Array( 1, 8, "区分1", 2, 10, "区分2",);
>var GzIf=new Array( 1, 8, 12, "名前1_1", 2, 8, 12,"名前1_2", 3, 10, 16, "名前2_1", 4, 10, 16, "名前2_2",);

で、閉じカッコの前に「,」があります。


2:[質問] ラムラム [2002/09/11 09:31 ]

あ〜!本当だ!ぱんださん、ありがとうございます!

自分でもどう書いていいのか、わかんないんですけど、
まず、区分1を選択すると、名前のコンボボックスには、名前1_1と名前1_2だけしか表示させないようにしたいのです。
で、区分2を選択すると、名前1_1と名前1_2が消えて、名前2_1と名前2_2だけが表示できるっていうようなプログラムってどうすれば出来るのでしょうか??


3:[回答] JTR [2002/09/11 09:55 ]

たぶん、参考になると思います。もろだったり…。
http://www.parkcity.ne.jp/~chaichan/src/javasc31.htm


4:[質問] ラムラム [2002/09/11 10:47 ]

JTRさん!ありがとうございます!
今からこの教えてもらったプログラムを頑張って理解しようと思います。(^▽^;)
で、ですね、二個目のコンボボックスで選択をしたら、3個目4個目のコンボボックスに関連データが2つ一緒に表示されるというプログラムもこの教えてもらったプログラムを理解すれば分かるんですかね〜。


5:[質問] ラムラム [2002/09/11 16:05 ]

JTRさんに教えてもらったプログラムを、すいませんけどパクってみてちょっと改良して作ってみたのですが、上手くいきません・・・・。(/_<。)グスッ。
ほとんど中身は替えていないのですが、コンボボックスの中に表示されません。どうして???
<HTML><HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=shift_JIS">
<META HTTP-EQUIV="Content-Type" CONTENT="text/css">
<TITLE>Test?</TITLE>
<SCRIPT LANGUAGE="JavaScript">
    var GzKb11 = new Array("区分1", "区分2", "区分3", "区分4");

    var GzIf21 = new Array("", "名前1_1", "名前1_2");
    var GzIf22 = new Array("", "名前2_1", "名前2_2", "名前2_3", "名前2_4");
    var GzIf23 = new Array("", "名前3_1", "名前3_2");
    var GzIf24 = new Array("", "名前4_1", "名前4_2");
function CreateList1(){
    Create(document.getElementById('strkubunn'), GzKb11);
}
function CreateList2(strForm){
    if(strForm.strkubunn.options.selectedIndex == 0){
        Create(document.getElementById('strMamae'). GzIf21);
    }
    else if(strForm.strkubunn.options.selectedIndex == 1){
        Create(document.getElementById('strMamae'). GzIf22);
    }
    else if(strForm.strkubunn.options.selectedIndex == 2){
        Create(document.getElementById('strMamae'). GzIf23);
    }
    else if(strForm.strkubunn.options.selectedIndex == 3){
        Create(document.getElementById('strMamae'). GzIf24);
    }
}
function Create(objList, objArray){
    var nMax = objArray.length;
    var nLoop = 0;
    for(nLoop = 0; nLoop < nMax; nLoop++){
        oAdd = document.createElement('option');
        if(objList.childNodes[nLoop] != undefined){
            objList.removeChild(objList.childNodes[nLoop]);
        }
        objList.appendChild(oAdd);
        objList.childNodes[nLoop].setAttribute('value',nLoop);
        oAddx = document.createTextNode(objArray[nLoop]);
        if(objList.childNodes[nLoop].firstChild != undefined){
            objList.childNodes[nLoop].removeChild(objList.childNodes[nLoop].firstChild);
        }
        objList.childNodes[nLoop].appendChild(oAddx);
    }
    objList.length = nLoop;
}
function onClickHuka(bool){
    document.NTextForm.nKazu.disabled = bool;
    document.NTextForm.nKazu.value = 0;
}
</SCRIPT>
</HEAD>
<BODY BGCOLOR="#ffffff">
<FORM METHOD=POST NAME="NTextForm">
<P><DIV ALIGN=CENTER>
<TABLE BORDER><TBODY onLoad="CreateList1()">
<TR><TD><B>区分</B></TD>
<TD><SELECT id = "strkubunn" NAME="strkubunn" onChange = "CreateList2(this.form)" MCLASS=FormPart>
</SELECT></TD>
<TD><B>名前</B></TD>
<TD><SELECT id = "strMamae" NAME="strMamae" MCLASS=FormPart>
</SELECT></TD>
<TD><B>数</B></TD>
<TD><INPUT TYPE=TEXT NAME="nKazu" SIZE=12 MAXLENGTH=1 onclick="onClickHuka(true);">
</TD></TR></TBODY>
</TABLE><BR></DIV></P>
<SCRIPT LANGUAGE="JavaScript">
onClickHuka(true)
</SCRIPT>
</FORM></BODY></HTML>


6:[回答] JTR [2002/09/11 16:35 ]

まず、onLoad="CreateList1()"を TBODYでなくBODYにする。
つぎに、Create関数の引数の区切りが『.』なく『,』にする。
そのつぎに、FORMの名前をNTextFormでなくstrFormにする。


7:[完了] ラムラム [2002/09/11 18:25 ]

出来ました!!!JTRさんのおかげです!!m(_ _)m
ありがとうございました♪なんとお礼をいっていいのやら。
わけが分からないプログラムを理解していただき、感謝しています!

回答(必須): 状態:

お名前(必須):

e-mail:

URL:




[戻る]

ChaichanPAPA's World