Javascript 分解大的dropdownlist，以避免具有巨大的功能
我已经在Javascript中创建了一个函数来接收列表，我必须初始化我的依赖dropdownlist所需的所有值。代码运行良好，问题是页面和函数本身中的数据太多。是否有一种方法可以使用列表创建单独的页面/类，然后通过调用它们将它们包含在函数中 这是我的代码，此代码用于依赖的dropdownlists：Javascript 分解大的dropdownlist，以避免具有巨大的功能,javascript,jsp,Javascript,Jsp,我已经在Javascript中创建了一个函数来接收列表，我必须初始化我的依赖dropdownlist所需的所有值。代码运行良好，问题是页面和函数本身中的数据太多。是否有一种方法可以使用列表创建单独的页面/类，然后通过调用它们将它们包含在函数中 这是我的代码，此代码用于依赖的dropdownlists： function dropdownlist(listindex) { //document.formname.departments.options.length = 0; //d
function dropdownlist(listindex)
{
//document.formname.departments.options.length = 0;
//document.formname.courseName.options.length = 0;
//document.formname.courseCode.options.length = 0;
//document.formname.subName.options.length = 0;
document.formname.subCode.options.length = 0;
switch (listindex)
{
//Faculties
//Departments
case "Sciences" :
document.formname.departments.options[0]=new Option("Select Department","");
document.formname.departments.options[1]=new Option("Animal Sciences","Animal Sciences");
document.formname.departments.options[2]=new Option("Crop Science","Crop Science");
document.formname.departments.options[3]=new Option("Chemistry","Chemistry");
document.formname.departments.options[4]=new Option("Mathematics and Statistics","Mathematics and Statistics");
document.formname.departments.options[5]=new Option("Nature Conservation","Nature Conservation");
document.formname.departments.options[6]=new Option("Environmental Health","Environmental Health");
document.formname.departments.options[7]=new Option("Physics","Physics");
break;
case "Humanities" :
document.formname.departments.options[0]=new Option("Select Department","");
document.formname.departments.options[1]=new Option("Journalism","Journalism");
document.formname.departments.options[2]=new Option("Educational Studies","Educational Studies");
document.formname.departments.options[3]=new Option("Public Management","Public Management");
document.formname.departments.options[4]=new Option("Mathematics","Mathematics");
document.formname.departments.options[5]=new Option("Law","Law");
document.formname.departments.options[6]=new Option("Public Relations","Public Relations");
document.formname.departments.options[7]=new Option("Applied Languages","Applied Languages");
document.formname.departments.options[8]=new Option("Business Commerce","Business Commerce");
document.formname.departments.options[9]=new Option("Safety and Security Management","Safety and Security Management");
break;
case "Engineering And Built Environm" :
document.formname.departments.options[0]=new Option("Select Department","");
document.formname.departments.options[1]=new Option("Architecture","Architecture");
document.formname.departments.options[2]=new Option("Building Sciences","Building Sciences");
document.formname.departments.options[3]=new Option("Civil Engineering","Civil Engineering");
document.formname.departments.options[4]=new Option("Chemical and Metallurgical Eng","Chemical and Metallurgical Eng");
document.formname.departments.options[5]=new Option("Eletrical Engineering","Eletrical Engineering");
document.formname.departments.options[6]=new Option("Geomatics","Geomatics");
document.formname.departments.options[7]=new Option("Industrial Engineering","Industrial Engineering");
document.formname.departments.options[8]=new Option("Machanical Engineering","Machanical Engineering");
break;
case "Information and Communication " :
document.formname.departments.options[0]=new Option("Select Department","");
document.formname.departments.options[1]=new Option("Computer Science","Computer Science");
document.formname.departments.options[2]=new Option("Computer Systems Engineering","Computer Systems Engineering");
document.formname.departments.options[3]=new Option("End User Computing","End User Computing");
document.formname.departments.options[4]=new Option("Informatics","Informatics");
document.formname.departments.options[5]=new Option("Information Technology","Information Technology");
document.formname.departments.options[6]=new Option("Software Engineering","Software Engineering");
document.formname.departments.options[7]=new Option("Web and Multimedia Computing","Web and Multimedia Computing");
break;
case "Management Sciences" :
document.formname.departments.options[0]=new Option("Select Department","");
document.formname.departments.options[1]=new Option("Hospitality Management","Hospitality Management");
document.formname.departments.options[2]=new Option("Management and Entrepreneurship","Management and Entrepreneurship");
document.formname.departments.options[3]=new Option("Logistics and Sport Management","Logistics and Sport Management");
document.formname.departments.options[4]=new Option("Office Management and Technology","Office Management and Technology");
document.formname.departments.options[5]=new Option("Operations Management","Operations Management");
document.formname.departments.options[6]=new Option("People Management and development","People Management and development");
document.formname.departments.options[7]=new Option("Tourism Management","Tourism Management");
document.formname.departments.options[8]=new Option("Marketing,Logistics and Sport Management","Marketing,Logistics and Sport Management");
document.formname.departments.options[9]=new Option("Office Management Technology","Office Management Technology");
break;
//COURSE NAMES UNDER DEPARTMENTS
/*****************Faculty of Engineering and the Built Environment***********************/
case "Architecture" :
document.formname.courseName.options[0]=new Option("Select Course","");
document.formname.courseName.options[1]=new Option("Professional","Professional");
document.formname.courseName.options[2]=new Option("Architectural Technology","Architectural Technology");
break;
case "Building Sciences" :
document.formname.courseName.options[0]=new Option("Select Course","");
document.formname.courseName.options[1]=new Option("Building","Building");
document.formname.courseName.options[2]=new Option("Construction Management","Construction Management");
document.formname.courseName.options[3]=new Option("Quantity Surveying","Quantity Surveying");
break;
case "Chemical and Metallurgical Eng" :
document.formname.courseName.options[0]=new Option("Select Course","");
document.formname.courseName.options[1]=new Option("Chemical","Chemical");
document.formname.courseName.options[2]=new Option("Metallurgy","Metallurgy");
document.formname.courseName.options[3]=new Option("Refractories","Refractories");
break;
case "Civil Engineering" :
document.formname.courseName.options[0]=new Option("Select Course","");
document.formname.courseName.options[1]=new Option("Civil","Civil");
document.formname.courseName.options[2]=new Option("Construction Management","Construction Management");
document.formname.courseName.options[3]=new Option("Environmental Engineering","Environmental Engineering");
document.formname.courseName.options[4]=new Option("Geotechnical Engineering","Geotechnical Engineering");
document.formname.courseName.options[5]=new Option("Structural Engineering","Structural Engineering");
document.formname.courseName.options[6]=new Option("Transportation Engineering","Transportation Engineering");
document.formname.courseName.options[7]=new Option("Urban Engineering","Urban Engineering");
document.formname.courseName.options[8]=new Option("Water Engineering","Water Engineering");
break;
case "Eletrical Engineering" :
document.formname.courseName.options[0]=new Option("Select Course","");
document.formname.courseName.options[1]=new Option("Eletrical","Eletrical");
document.formname.courseName.options[2]=new Option("Electronic Engineering","Electronic Engineering");
document.formname.courseName.options[3]=new Option("Power Engineering","Power Engineering");
break;
case "Geomatics" :
document.formname.courseName.options[0]=new Option("Select Course","");
document.formname.courseName.options[1]=new Option("Surveying","Surveying");
document.formname.courseName.options[2]=new Option("Cartography","Cartography");
break;
case "Industrial Engineering" :
document.formname.courseName.options[0]=new Option("Select Course","");
document.formname.courseName.options[1]=new Option("Industrial","Industrial");
document.formname.courseName.options[2]=new Option("Technology Management","Technology Management");
break;
case "Machanical Engineering" :
document.formname.courseName.options[0]=new Option("Select Course","");
document.formname.courseName.options[1]=new Option("Mechanical","Mechanical");
document.formname.courseName.options[2]=new Option("Mechatronics","Mechatronics");
document.formname.courseName.options[3]=new Option("Polymer Technology","Polymer Technology");
document.formname.courseName.options[4]=new Option("Three-Dimension Design","Three-Dimension Design");
break;
/******************************COURSE CODES = Faculty of Engineering and the Built Environment****************************************/
case "Professional" :
document.formname.courseCode.options[0]=new Option("Select Course","");
document.formname.courseCode.options[1]=new Option("MTPSSO","MTPSSO");
document.formname.courseCode.options[2]=new Option("BTPS09","BTPS09");
break;
case "Architectural Technology" :
document.formname.courseCode.options[0]=new Option("Select Course","");
document.formname.courseCode.options[1]=new Option("MTAD96","MTAD96");
document.formname.courseCode.options[2]=new Option("BTAQ95","BTAQ95");
break;
case "Building" :
document.formname.courseCode.options[0]=new Option("Select Course","");
document.formname.courseCode.options[1]=new Option("NDBU04","NDBU04");
break;
case "Construction Management" :
document.formname.courseCode.options[0]=new Option("Select Course","");
document.formname.courseCode.options[1]=new Option("BTCU02","BTCU02");
document.formname.courseCode.options[2]=new Option("MTCUSO/MTCU95","MTCUSO/MTCU95");
break;
case "Quantity Surveying" :
document.formname.courseCode.options[0]=new Option("Select Course","");
document.formname.courseCode.options[1]=new Option("BTQCE03","BTQCE03");
document.formname.courseCode.options[2]=new Option("MTQSSO/MTQS95","MTQSSO/MTQS95");
break;
case "Chemical" :
document.formname.courseCode.options[0]=new Option("Select Course","");
document.formname.courseCode.options[1]=new Option("NDCE03","NDCE03");
document.formname.courseCode.options[2]=new Option("NDCEF0","NDCEF0");
document.formname.courseCode.options[3]=new Option("BTCE02","BTCE02");
document.formname.courseCode.options[4]=new Option("MTCE95","MTCE95");
document.formname.courseCode.options[5]=new Option("DTCE96","DTCE96");
break;
case "Metallurgy" :
document.formname.courseCode.options[0]=new Option("Select Course","");
document.formname.courseCode.options[1]=new Option("NDMY03","NDMY03");
document.formname.courseCode.options[2]=new Option("NDMYF0","NDMYF0");
document.formname.courseCode.options[3]=new Option("BTMY02","BTMY02");
document.formname.courseCode.options[4]=new Option("MTMY96","MTMY96");
document.formname.courseCode.options[5]=new Option("DTMY96","DTMY96");
break;
case "Refractories" :
document.formname.courseCode.options[0]=new Option("Select Course","");
document.formname.courseCode.options[1]=new Option("BTKR01","BTKR01");
break;
case "Civil" :
document.formname.courseCode.options[0]=new Option("Select Course","");
document.formname.courseCode.options[1]=new Option("NDCI03","NDCI03");
document.formname.courseCode.options[2]=new Option("NDCIF0","NDCIF0");
document.formname.courseCode.options[3]=new Option("BTKG02","BTKG02");
document.formname.courseCode.options[4]=new Option("BTOI02","BTOI02");
document.formname.courseCode.options[5]=new Option("BTGO02","BTGO02");
document.formname.courseCode.options[6]=new Option("BTSQ02","BTSQ02");
document.formname.courseCode.options[7]=new Option("BTTO02","BTTO02");
document.formname.courseCode.options[8]=new Option("MTCI95","MTCI95");
document.formname.courseCode.options[9]=new Option("DTCI96","DTCI96");
break;
/*****************DEPARTMENTS OF ICT***********************/
case "Computer Science" :
document.formname.courseName.options[0]=new Option("Select Course","");
document.formname.courseName.options[1]=new Option("Information Networks","Information Networks");
document.formname.courseName.options[2]=new Option("Computer Science and Data Processing","Computer Science and Data Processing");
document.formname.courseName.options[3]=new Option("Information Technology","Information Technology");
document.formname.courseName.options[3]=new Option("Technical Applications","Technical Applications");
document.formname.courseName.options[4]=new Option("Professional Practise in Information Technology","Professional Practise in Information Technology");
break;
/*****************COURSE CODES IN DEPARTMENTS OF ICT*********************************/
case "Information Technology" :
document.formname.courseCode.options[0]=new Option("Select Course","");
document.formname.courseCode.options[1]=new Option("NDIT04/NDIT12","NDIT04/NDIT12");
document.formname.courseCode.options[2]=new Option("NDITF1","NDITF1");
break;
case "Information Networks" :
document.formname.courseCode.options[0]=new Option("Select Course","");
document.formname.courseCode.options[1]=new Option("MTINS0","MTINS0");
document.formname.courseCode.options[2]=new Option("MTIN01","MTIN01");
break;
case "Computer Science and Data Processing" :
document.formname.courseCode.options[0]=new Option("Select Course","");
document.formname.courseCode.options[1]=new Option("DTIN08","DTIN08");
document.formname.courseCode.options[2]=new Option("DTIL08","DTIL08");
document.formname.courseCode.options[3]=new Option("DTPF08","DTPF08");
break;
case "Technical Applications" :
document.formname.courseCode.options[0]=new Option("Select Course","");
document.formname.courseCode.options[1]=new Option("NDIL04/NDIL12","NDIL04/NDIL12");
document.formname.courseCode.options[2]=new Option("BTIL05","BTIL05");
document.formname.courseCode.options[3]=new Option("MTIL95","MTIL95");
break;
case "Professional Practise in Information Technology" :
document.formname.courseCode.options[0]=new Option("Select Course","");
document.formname.courseCode.options[1]=new Option("BTPF03","BTPF03");
document.formname.courseCode.options[2]=new Option("MTPFS1","MTPFS1");
document.formname.courseCode.options[3]=new Option("MTPF01","MTPF01");
break;
//SUBJECTS NAMES IN THE COMPUTER SCIENCE DEPARTMENT...Technical Apps
case "NDIL04/NDIL12":
document.formname.subName.options[0]=new Option("Select Subject","");
document.formname.subName.options[1]=new Option("Industry Exposure","Industry Exposure");
break;
case "Industry Exposure":
document.formname.subCode.options[0]=new Option("Select Subject Code","");
document.formname.subCode.options[1]=new Option("IDC30DB","IDC30DB");
break;
}
return true;
}
我打赌你可以做得更短，但这只是一个开始：
var sciences = [["...", "..."], ["...", "..."], ["...", "..."],...];
var humanities = [["...", "..."], ["...", "..."], ["...", "..."],...];
...
switch (listIndex) {
case "Sciences" :
for(int i = 0; i < sciences.length; i++) {
document.formname.departments.options[i] = new Option(sciences[i][0], sciences[i][1]);
}
break;
case...
....
}
var sciences=[[“…”、“…”、[“…”、“…”、[“…”、“…”、…]；
变量=[“…”、“…”、[“…”、“…”、[“…”]、[“…”、“…]”、…]；
...
开关（列表索引）{
案例“科学”：
for（int i=0；ivar departments = {
'Sciences': [ '...', '...', '...' ],
'Humanities': [ '...', '...', '...' ],
...
},
courseNames = {
'Sciences': [ '...', '...', '...' ],
'Humanities': [ '...', '...', '...' ],
...
},
...;
function createOptions( items ) {
options = [];
for( var i=0; max=items.length; i<max; ++i ) {
options.push( new Option( data[i], data[i] );
}
return options;
}
document.formname.departments.options = createOptions( departments );
document.formname.courseName.options = createOptions( courseName );
var部门={
“科学”：[“…”，“…”，“…”，
“人文学科”：[“…”，“…”，“…”，
...
},
课程名称={
“科学”：[“…”，“…”，“…”，
“人文学科”：[“…”，“…”，“…”，
...
},
...;
函数createOptions（项）{
期权=[]；
对于（var i=0；max=items.length；iIt），当选择某个系时，当然可以按需加载该系的课程列表，以避免大量的初始下载。我不知道如何加载，我只是一个漫游编辑。