JavaScript基礎 簡單的二級聯動下拉式清單

標籤：資源   this   思考   charset   set   element   firefox   cte   之間   

 鎮場詩：
　　　　清心感悟智慧語，不著世間名與利。學水處下納百川，舍盡貢高我慢意。
　　　　學有小成返哺根，願鑄一良心部落格。誠心於此寫經驗，願見文者得啟發。
——————————————————————————————————————————

code:

<!DOCTYPE html><html><head>    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>    <title></title><meta charset="utf-8" />    <script type="text/javascript">        //這個 請選擇 選項 加的很好。        var jiaArr = ["請選擇","儒家", "佛家", "道家"];        var exampleArr = [                ["請選擇"],                ["孔子", "論語", "三字經"],                ["釋迦牟尼", "金剛經", "楞嚴經"],                ["老子", "莊子", "北鬥經"]        ];        window.onload = function () {                        var selJia = document.getElementById("jia");            //申請空間            selJia.length = jiaArr.length;            //添加元素            for (var i = 0; i < jiaArr.length; i++) {                selJia.options[i].text = jiaArr[i];                selJia.options[i].value = jiaArr[i];            }        }        function ChangeExampleSelect(index)        {            var selExa = document.getElementById("example");            selExa.length = exampleArr[index].length;            for (var i = 0; i < exampleArr[index].length; i++)            {                selExa.options[i].text = exampleArr[index][i];                selExa.options[i].value = exampleArr[index][i];            }        }    </script></head><body>    <select id="jia" onchange="ChangeExampleSelect(this.selectedIndex)">    </select>    <select id="example">    </select></body></html>

 

result:

　　初始狀態,

 

　　第一個列表進行選擇,

 

　　聯動,

 

事物之間是有聯絡的。

——————————————————————————————————————————
博文的精髓，在技術部分，更在鎮場一詩。IDE: VS2015;瀏覽器: Firefox。
html+css+js，強，值得努力學習。傳智播客的視頻教程是我的學習資源,推薦。
如果博文有可以改進的地方，請留下評論，我會認真思考的。

註：我是一位正在努力的普通人，此文僅供測試與參考使用，不可做其他用途。當參考博文內容時，代表您已接受使用規定。

JavaScript基礎 簡單的二級聯動下拉式清單