Autor |
Nachricht |
Questioner
Threadersteller
Dabei seit: 23.12.2008
Ort: -
Alter: -
Geschlecht:
|
Verfasst Di 23.12.2008 11:45
Titel JS: dynmischen Wert in Variable statisch machen? |
|
|
Auf dieses Problem bin ich jetzt schon sehr häufig gestoßen, aber habe bis heute noch keine Lösung.
Ich möchte im einfachsten Falle einer Liste mit Elementen eine Ereignisfunktion zuweisen und dieser den Zähler einer Schleife als Parameter übergeben:
Code: |
for(var i = 0; i < elementListe.length; i++){
elementListe[i].onclick = function() { ausgabe(i); }
}
function ausgabe(zahl){
alert(zahl);
}
|
Nun soll also, wenn ich auf das Element 2 klicke die Zahl 1 ausgegeben werden und wenn ich auf das 6. Element klicke, die Zahl 5.
Da i jedoch bei der Zuweisung der Funktion weiterhin dynamisch bleibt, sind auch die Änderungen an der Zählervariablen rückwirkend.
Umfasst die Liste der Elemente also 10, so erhält man als Ausgabe beim Klick jedes bliebigen Elements die Zahl 9, da ja auch das erste Element i ausgeben soll und i am Schluss 9 geworden ist.
Geht das nicht auch anders?
Und wenn ja, wie?
Liebe Grüße,
Questioner[/code]
|
|
|
|
|
zweitaccount
Dabei seit: 25.01.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 23.12.2008 12:00
Titel
|
|
|
Hi, in dem Fall am einfachsten z.B. so:
Code: | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Wert zuweisen</title>
<script type="text/javascript">
var addEvents = function() {
var elementListe = document.getElementsByTagName('div');
for (var i = 0; i < elementListe.length; i++) {
elementListe[i].count = i;
elementListe[i].onclick = function() {
ausgabe(this.count);
}
}
}
function ausgabe(zahl){
alert(zahl);
}
window.onload = addEvents;
</script>
</head>
<body>
<div>el1</div>
<div>el2</div>
<div>el3</div>
<div>el4</div>
<div>el5</div>
<div>el6</div>
<div>el7</div>
<div>el8</div>
<div>el9</div>
<div>el10</div>
</body>
</html>
|
Gruß zweitaccount
|
|
|
|
|
Anzeige
|
|
|
Questioner
Threadersteller
Dabei seit: 23.12.2008
Ort: -
Alter: -
Geschlecht:
|
Verfasst Di 23.12.2008 12:32
Titel
|
|
|
Sehr schön!
das ist zwar sicher nicht die sauberste Lösung, aber sie hat, was meine Lösungen bisher nicht hatten:
Sie funktioniert
Vielen vielen Dank!
|
|
|
|
|
pixelpapst303
Dabei seit: 06.07.2006
Ort: hamburg
Alter: 50
Geschlecht:
|
Verfasst Di 23.12.2008 13:04
Titel
|
|
|
Questioner hat geschrieben: |
das ist zwar sicher nicht die sauberste Lösung... |
ich seh da nicht wirklich was unsauberes bei...!!!
|
|
|
|
|
Inselmensch
Dabei seit: 03.09.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 23.12.2008 14:58
Titel
|
|
|
hat sich letztlich ja nichts geändert...
Originalcode:
Code: |
for(var i = 0; i < elementListe.length; i++){
elementListe[i].index = i;
elementListe[i].onclick = function() { ausgabe(this.index); }
}
function ausgabe(zahl){
alert(zahl);
}
|
|
|
|
|
|
zweitaccount
Dabei seit: 25.01.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 23.12.2008 15:44
Titel
|
|
|
@Questioner
unsauber?
Man kann mit diesen vermeindlich »unsauberen«
Methoden jedenfalls noch viel mehr Unsinn anstellen,
z.B. html, functionen oder auch objecte mit reinpacken
Da ist der Phantasie kaum Grenzen gesetzt.
Code: | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Wert zuweisen</title>
<style type="text/css">
.class1 {
background:blue;
}
.class2 {
background:yellow;
}
.class3 {
background:brown;
}
.class4 {
background:grey;
}
.class5 {
background:pink;
}
.class6 {
background:purple;
}
.class7 {
background:cyan;
}
.class8 {
background:lightblue;
}
.class9 {
background:darkred;
}
.class10 {
background:silver;
}
</style>
<script type="text/javascript">
var addEvents = function() {
var elementListe = document.getElementsByTagName('div');
for (var i = 0; i < elementListe.length; i++) {
elementListe[i].count = i;
elementListe[i].html = '<p>Ich bin das '+i+'. Element.</p>';
elementListe[i].funktion = function() {
alert(this.html);
}
elementListe[i].objekt = {
fettMachen: function(el) {
el.style.fontWeight = 'bold';
this.rotMachen(el);
},
rotMachen: function(el) {
el.style.color = 'red';
}
}
elementListe[i].onclick = function() {
this.innerHTML = this.html;
this.funktion();
this.objekt.fettMachen(this);
this.className = 'class' + (this.count + 1);
}
}
}
window.onload = addEvents;
</script>
</head>
<body>
<div>el1</div>
<div>el2</div>
<div>el3</div>
<div>el4</div>
<div>el5</div>
<div>el6</div>
<div>el7</div>
<div>el8</div>
<div>el9</div>
<div>el10</div>
</body>
</html>
|
// ups, jetzt stimmts
Zuletzt bearbeitet von zweitaccount am Di 23.12.2008 15:50, insgesamt 2-mal bearbeitet
|
|
|
|
|
pixelpapst303
Dabei seit: 06.07.2006
Ort: hamburg
Alter: 50
Geschlecht:
|
Verfasst Di 23.12.2008 15:50
Titel
|
|
|
zweitaccount hat geschrieben: | functionen ... objecte |
kommst du etwa auch aus hamburg? hier darf man offiziell denglischen
schönes beispiel und alle mal NICHT unsauber...!!!
|
|
|
|
|
zweitaccount
Dabei seit: 25.01.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 23.12.2008 16:02
Titel
|
|
|
pixelpapst303 hat geschrieben: | zweitaccount hat geschrieben: | functionen ... objecte |
kommst du etwa auch aus hamburg? hier darf man offiziell denglischen
schönes beispiel und alle mal NICHT unsauber...!!! |
ups - funktionen und objekte meinte ich natürlich
Da kann man aber auch durcheinander kommen.
|
|
|
|
|
|
|
|
Ähnliche Themen |
Variable auf Wert überprüfen
[PHP] Array-Wert an Variable übergeben
dynamischer Wert als Inhalt einer variable - geht das in as?
[SQL] Variable durch Variable aus anderer Tabelle ersetzen
DIV nebeneinander statisch UND dynamisch?
startseite statisch --> verlinkt auf wp
|
|