Problem med objekt og metode
HejJeg er kørt helt fast i en JavaScript-opgave. Den er på begynderniveau og skulle nok ikke være så vanskelig, men jeg har et anstrengt forhold til funktioner og metoder, så jeg vil være taknemlig for hjælp til en løsning.
Opgaven er ret bunden og består i at gøre scriptet herunder færdigt:
Add a method named update() to the object that you create using a constructor. This method should take one parameter and update one of the properties of the object. Test your method by writing code to display an object's properties in the web page, in the "display" <div>.
<!doctype html>
<html lang="en">
<head>
<title>Objects and Methods</title>
<meta charset="utf-8">
<script>
window.onload = init;
function anObject(property1, property2, property3) {
this.property1 = property1;
this.property2 = property2;
this.property3 = property3;
// your code here
}
function init() {
// your code here.
}
</script>
</head>
<body>
<div id="display">
</div>
</body>
</html>
Jeg bruger et antal undervisningsforløb til mine objekter og opretter dem med titel, den retning de hører ind under, samt et tal der angiver hvordan de er prioriteret i det endelige skema. Det er meningen at update-metoden skal bruges til at ændre prioriteringen fra at være 1, 2 og 3 til at være A, B og C.
Alt det giver mig mindst to problemer. Det første er this.update, som jeg ikke ved præcist hvordan jeg får til at virke. Jeg har forsøgt mig med at bruge et eksempel fra w3schools (http://www.w3schools.com/js/tryit.asp?filename=tryjs_create_object3) som model. Det giver de tilføjelser, som jeg har markeret med // - både selve this.update og opdateringerne i init(), men jeg føler mig ikke sikker på de er rigtige.
Andet problem er det der skal følge efter div.innerHTML. Jeg formoder det er noget med at kalde metoden, måske også noget med at angive et argument og ydermere håndtere scope... men her bliver forvirringen mærkbar :(
Endelig, tænker jeg, ville det være fint hvis det til sidst kan vises på websiden med en onclick-funktion, så brugeren ser titel, retning og gammel prioritering med "Klik her for at se den nye prioritering". Så er jeg i hvert fald oppe på tre problemer.
/Stig
<!doctype html>
<html lang="en">
<head>
<title>Curriculum Planning</title>
<meta charset="utf-8">
<script>
window.onload = init;
function Course(title, programme, rating) {
this.title = title;
this.programme = programme;
this.rating = rating;
this.update = function() {
};
}
//støttet på w3schools:
//this.update = function(new_rating) {
//this.rating = new_rating;
//}
function init() {
var real = new Course("Real Time Software", "Software Construction", "3");
var xml = new Course("XML and Web Technologies", "Software Construction", "1");
var database = new Course("Database Design", "Software Construction", "2");
var web = new Course("Web Application Development", "Interaction Design", "1");
var user = new Course("User Experience Design", "Interaction Design", "2");
var computer = new Course("Computer Games", "Interaction Design", "3");
//støttet på w3schools:
//real.update("C");
//xml.update("A");
//database.update("B");
//web.update("A");
//user.update("B");
//computer.update("C");
var div = document.getElementById("display");
div.innerHTML = //...
}
</script>
</head>
<body>
<div id="display">
</div>
</body>
</html>
