Jag håller på att göra ett formulär som hanterar saker som skall läggas på olika positioner. De positioner som finns att tillgå hämtar jag från en databas med hjälp av asp och dessa stoppar jag i en JavaScript-Array för att sen använda i select-boxar som skall "dela" på dessa positioner (dvs om en position blir vald skall den inte gå att välja i någon annan select-box och om man väljer om i en box skall det tidigare valda alternativet sättas in i övriga select-boxar).
Jag har skrivit kod som åstadkommer just detta. Men om man har många positioner (typ 55) som skall uppdateras tar det fruktansvärt lång tid för scriptet att köra.
Min fråga är därför:
- Kan ni dissekera koden här och komma med prestandahöjjande tips?
<script language="JavaScript">
// Globala variabler
var arrSelPos = new Array(7);
var arrFreePos = ["" ,"A01","A02","A03","A04","A05","A06","A07","A08"];
function updatePos(intPos){
var strSelectedValue = eval("pos" + intPos + ".value");
// Lägg in det gamla tillbaka i arrFreePos.
if(arrSelPos[intPos] != undefined && arrSelPos[intPos]!=""){
arrFreePos = arrFreePos.concat(arrSelPos[intPos]);
arrFreePos.sort();
}
// Ta bort det valda värdet ur arrFreePos
if(strSelectedValue!=""){
for(var i=0;i<arrFreePos.length;i++){
if(arrFreePos[i]==strSelectedValue){
arrFreePos = arrFreePos.slice(0, i).concat(arrFreePos.slice(i+1,arrFreePos.length))
break;
}
}
}
//det nya värdet i arrSelPos
arrSelPos[intPos] = strSelectedValue;
for(var j=0;j<arrSelPos.length;j++){
writePos(j);
}
}
function writePos(intSelPos){
var arrTMP = arrFreePos;
var intSelectedPos;
// Töm boxen
document.getElementById("pos"+intSelPos).options.length = 0;
// Hämta vald position och sortera
if(arrSelPos[intSelPos] != undefined && arrSelPos[intSelPos]!=""){
arrTMP = arrTMP.concat(arrSelPos[intSelPos]);
arrTMP.sort();
}
// Fyll boxen
for(var j=0;j<arrTMP.length;j++){
objOption = new Option(arrTMP[j], arrTMP[j]);
document.getElementById("pos"+intSelPos).add(objOption);
//Kolla om det är första gången
if(arrSelPos[intSelPos] == undefined){
intSelectedPos=0;
}else if(arrTMP[j]==arrSelPos[intSelPos]){
intSelectedPos = j;
}
}
//Välj pos som ska vara vald
document.getElementById("pos"+intSelPos).selectedIndex = intSelectedPos;
}
for(var i=0;i<7;i++){
document.write("Position <select id='pos" + i + "' onchange='updatePos(" + i + ");'></select>");
writePos(i);
}
</script>
Jag kollade runt lite på nätet och hittade att man ska undvika att anropa objekt många gånger så jag gjorde en liten förändring som ökade prestandan lite grann:
I funktionen writePos flyttade jag ut document.getElementById("pos"+intSelPos) ur for-slingan och stoppade i en variabel:
var objBox = document.getElementById("pos"+intSelPos);
Och sedan anropar jag variabeln istället i for-slingan när jag skall skriva ut de olika select-box-alternativen:
objBox.add(objOption);
272 ms totalt · 4 externa anrop · v20260731065814-full.a51de22e