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

房東：小明
發表時間：2010-03-01

贊助網站

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

1 樓住戶：jack
發表時間：2010-03-02

html 部分

Make your selection

以下存為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

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

姓名：

佈告內容：

其他選項:

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

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