WEB相談室

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

タイトル:プルダウン1とプルダウン2の連動

0:[投稿] きう [2002/06/21 10:17 ][環境:MAC+IE わからない]

余所サマのソースを元に弄ってみたのですが、うまくいきません。とても急いでいるので、申し訳ないなと思いながらソースまで載せてさせていただきます。

例えば
ドロップダウン1で6月を選べば26日〜30日のドロップダウン2表示、
ドロップダウン1で7月を選べば1日〜24日のドロップダウン2表示
としたいのです。

プレビューしたときの不具合は、
7月をプルダウンしたとき、
日付が6月の内容+7月の内容で表示されてしまうのです。
そして、6月に戻っても6月の内容+7月の内容で表示のままなのです。
ワタシの環境はmac IE5.1なのですが、それ故なのでしょうか。

<script Language="JavaScript"><!--
var strSmonth = new Array("6","7");
var strSdaySix = new Array("26","27","28","29","30");
var strSdaySeven = new Array("1","2","3","4","5","6","7","8","9
","10","11","12","13","14","15","16","17","18","19","20","21","22","23","24");
function CreateList()
{
Create(document.myFORM.lstSmonth, strSmonth);
CreateList2();
}
function CreateList2()
{
var nSelectIndex = 0;
nSelectIndex = document.myFORM.lstSmonth.value;
if(strSmonth[nSelectIndex] == "6")
{
Create(document.myFORM.lstSday, strSdaySix);    
}else if(strSmonth[nSelectIndex] == "7"){
Create(document.myFORM.lstSday, strSdaySeven);    
}
}
function Create(objList, objArray)
{
var nMax = objArray.length;
var nLoop = 0;
for (nLoop = 0; nLoop < nMax; nLoop++)
{
var oAdd = document.createElement("OPTION");
oAdd.text = objArray[nLoop];
oAdd.value = nLoop;
objList.add(oAdd);
}
}
// -->
</script>
</head>
<BODY onLoad="CreateList()">
<FORM name="myFORM">
<SELECT size="1" name="lstSmonth" onChange="CreateList2()"&gt;</SELECT>
<BR>
<SELECT size="1" name="lstSday"></SELECT>
</form>
</body>

まだ知識が浅いながらに、頑張ってみたのですが。
どなたかお力添えをお願いします!
どうか、助けて下さい!


1:[完了] きう [2002/06/21 14:07 ]

手法を変えてみたら、出来ました!

以下が、サンプルです。
http://hp.vector.co.jp/authors/VA013453/js/000925_.htm


2:[関連] ナン [2002/06/24 17:06 ]

http://www.parkcity.ne.jp/~chaichan/src/javascdom01.htm
を参考にDOMで組んでみました。

<html>
<head>
<script>
var strSmonth = new Array("6","7");
var strSdaySix = new Array("26","27","28","29","30");
var strSdaySeven = new Array("1","2","3","4","5","6","7","8","9","10","11","12","13","14","15","16","17","18","19","20","21","22","23","24");
var inzfg = 0;

function CreateList()
{
    Create(document.getElementById('lstSmonth'), strSmonth);
    CreateList2();
}
function CreateList2()
{
    var nSelectIndex = 0;
    nSelectIndex = document.myFORM.lstSmonth.options[document.myFORM.lstSmonth.options.selectedIndex].value;

    if(strSmonth[nSelectIndex] == "6"){
        Create(document.getElementById('lstSday'), strSdaySix);
    }
    else if(strSmonth[nSelectIndex] == "7"){
        Create(document.getElementById('lstSday'), strSdaySeven);    
    }
}
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;
}
</script>
</head>
<BODY onLoad="CreateList()">
<FORM name="myFORM">
<SELECT size="1" id="lstSmonth" name="lstSmonth" onChange="CreateList2()"></SELECT>
<SELECT size="1" id="lstSday" name="lstSday"></SELECT>
</FORM>
</BODY>
</html>

回答(必須): 状態:

お名前(必須):

e-mail:

URL:




[戻る]

ChaichanPAPA's World