JSPプルダウン枠実現値連動例

3453 ワード
jsp 実例 フレームを下げる 値連動
これは簡単で基本的なドロップダウンリンク連動の例であり、この例は主に2段階連動のみであり、1段階目は固定オプションであり、2段階目の内容も比較的簡単である.ここではjavascriptを使って第二段のプルダウン枠を連動させます.
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
  <HTML>
  <HEAD>
  <meta http-equiv="pragma" content="no-cache">
  <meta http-equiv="cache-control" content="no-cache">
  <meta http-equiv="expires" content="0">
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <TITLE> New Document </TITLE>
  <script>
     //          ，               。  selectedIndex                  
     var city=[
     ["  ","  ","  ","  "],
     ["  ","  ","  ","  "],
     ["  ","  ","  ","  "],
     ["  ","  ","  ","  "],
     ["  ","  ","  ","  "]
     ];
 
     function getCity(){
         //          
         var sltProvince=document.form1.province;
         //          
         var sltCity=document.form1.city;
         
         //           
         var provinceCity=city[sltProvince.selectedIndex - 1];
 
         //       ，      
         sltCity.length=1;
 
         //                 
         for(var i=0;i<provinceCity.length;i++){
			 //Option(    ，   )     <option value="   " >    </option>;
             sltCity[i+1]=new Option(provinceCity[i],provinceCity[i]);
         }
     }
 </script>
 </HEAD>
 
 <BODY>
 <FORM METHOD=POST ACTION="" name="form1">
         <SELECT NAME="province" onChange="getCity()">
             <OPTION VALUE="0">        </OPTION>
             <OPTION VALUE="   ">    </OPTION>
             <OPTION VALUE="   ">    </OPTION>
             <OPTION VALUE="   ">    </OPTION>
             <OPTION VALUE="   ">    </OPTION>
             <OPTION VALUE="   ">    </OPTION>
         </SELECT>
         <SELECT NAME="city">
             <OPTION VALUE="0">        </OPTION>
         </SELECT>
     </FORM>
 </BODY>
 </HTML>
このコードは比較的簡単です.
jsにあまり詳しくないなら、以下のjs処理selectの対象について見てもいいです.
1、selectedIndex属性を使って、現在のオプションの索引を取得する
    ドロップダウンボックスのオプションは、現在選択されているオプションの索引番号を表している線形配列で、各オプションにインデックスがあります.オプティクスのプロパティを結合すると、選択されたオプトオブジェクトが得られ、さらに処理されます.ドロップダウンボックスが複数選択できる場合、selectedIndex属性は最初の選択された索引を返します.
    selected Indexは読み取り専用の属性です.インデックスで指定されたプルダウンボックスの項目を選択状態に設定したいです.オプトオブジェクトのselected=trueを設定して実現できます.
2、selectオブジェクトにオプションを追加します.
    
sltCity[i
＋
1
」
を選択します.
new
 Option(province City[i],province City[i])    
new
 Option(province City[i],province City[i]は一つの値を作成するという意味です.
province City[i]は、テキストは
province City[i]のオプトオブジェクトは、
sltCityはページ上のシティオブジェクトであり、
i
＋
1新規オプションの位置を指定します.3、selectオブジェクトをクリアする    ドロップダウン枠のすべてのオプションを削除するには、2つの方法があります.    最初の方法は巡回削除です.   
1 var l=myslect.length;
2 
for(var) i=0;i3    myslect.options[i]=
null
4 }
    第二の方法は比較的簡単なので、一般的にこの方法を使います.
myslect.length=0
転載元:http://www.blogjava.net/rickhunter/articles/64607.html
jsのGenerator関数