多年拆除工程經驗,專營裝潢拆除
隔間打牆等施工,歡迎洽詢
比價網創新廣告招牌設計,親民價格
頂級質感,連鎖企業合作推薦!

首頁  •  tw 論壇 • 程式設計討論     • 

[教學]JS動態下拉式選單 三階層

房東:小明
發表時間:2010-03-01
[檢舉]




 

 






  • 贊助網站       

    廣利不動產-板橋在地生根最實在--新板特區指名度最高、值得您信賴的好房仲
    完整房訊,房屋、店面熱門精選物件,廣利不動產 優質仲介,房屋租賃、買賣資訊透明,交易真安心!
    廣利不動產-新板特區指名度最高、值得您信賴的好房仲
    您的托付,廣利用心為您服務

  • 1 樓住戶:jack
    發表時間:2010-03-02
    [檢舉]

    html 部分




    Make your selection














    Country:

    State:

    City:













    以下存為countryStateCity.js 檔案


    /* This script and many more are available free online at
    The JavaScript Source!! http://javascript.internet.com
    Created by: Michael J. Damato | http://developing.damato.net/ */
    // State lists
    var states = new Array();

    states['Canada'] = new Array('Alberta','British Columbia','Ontario');
    states['Mexico'] = new Array('Baja California','Chihuahua','Jalisco');
    states['United States'] = new Array('California','Florida','New York');


    // City lists
    var cities = new Array();

    cities['Canada'] = new Array();
    cities['Canada']['Alberta'] = new Array('Edmonton','Calgary');
    cities['Canada']['British Columbia'] = new Array('Victoria','Vancouver');
    cities['Canada']['Ontario'] = new Array('Toronto','Hamilton');

    cities['Mexico'] = new Array();
    cities['Mexico']['Baja California'] = new Array('Tijauna','Mexicali');
    cities['Mexico']['Chihuahua'] = new Array('Ciudad Juárez','Chihuahua');
    cities['Mexico']['Jalisco'] = new Array('Guadalajara','Chapala');

    cities['United States'] = new Array();
    cities['United States']['California'] = new Array('Los Angeles','San Francisco');
    cities['United States']['Florida'] = new Array('Miami','Orlando');
    cities['United States']['New York'] = new Array('Buffalo','new York');


    function setStates() {
    cntrySel = document.getElementById('country');
    stateList = states[cntrySel.value];
    changeSelect('state', stateList, stateList);
    setCities();
    }

    function setCities() {
    cntrySel = document.getElementById('country');
    stateSel = document.getElementById('state');
    cityList = cities[cntrySel.value][stateSel.value];
    changeSelect('city', cityList, cityList);
    }

    function changeSelect(fieldID, newOptions, newValues) {
    selectField = document.getElementById(fieldID);
    selectField.options.length = 0;
    for (i=0; i selectField.options[selectField.length] = new Option(newOptions[i], newValues[i]);
    }
    }

    // Multiple onload function created by: Simon Willison
    // http://simonwillison.net/2004/May/26/addLoadEvent/
    function addLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
    window.onload = func;
    } else {
    window.onload = function() {
    if (oldonload) {
    oldonload();
    }
    func();
    }
    }
    }

    addLoadEvent(function() {
    setStates();
    });


    2 樓住戶:阿保
    發表時間:2010-03-02
    [檢舉]





    3 level dynamic drop down list using javascript






















    Continent :



    Countries :





    Cities :












     共 2 人回應  選擇頁數 【第1 頁】 

    姓名:
    佈告內容: