|
|||
JS wartet nich auf Ende von rekursiver Funktion
Hallo zusammen!
Ich habe in Problem mit rekursiven Funktionsaufrufen in JS. Und zwar, wartet JS nicht auf das Ende des letzten Funktionsaufrufs aus der Funktion selbst heraus, sondern macht direkt nach dem ersten Aufruf der Hauptfunktion einfach weiter. Wie kann ich das verhindern? Ich könnte mir auch vorstellen, dass es daran liegt, dass ich die Rekursion mit window.setTimeout() auslöse. Wenn ja, wie kann ich das umgehen? Hier mal ein Beispiel: HTML-Code:
<?php header('content-type: text/html; charset=utf-8'); ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de"> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <title>Background Click</title> <link rel="stylesheet" type="text/css" href="reset.css" /> <script type="text/javascript"> var config = new Array(); config['debug'] = 'false'; config['text_speed'] = 30; function show_text(text,pos) { if(config['debug'] != 'true' && text == 'kein JSON') { document.getElementById('box_text').innerHTML = 'Ein Fehler ist aufgetreten'; return false; } if(config['text_speed'] == 'instant') document.getElementById('box_text').innerHTML = text; else { a_pos = text.indexOf('<a ',pos); if(typeof pos == 'undefined') pos = 0; pos = parseInt(pos); // if(pos == 0) block_box(text); document.getElementById('box_text').innerHTML = text.substr(0,pos); new_letter = document.createElement('span'); bla = text.indexOf('<br />'); blubb = text.indexOf('<br />',pos); if(text.indexOf('<br />',pos) == pos) { new_letter.innerHTML = '<br />'; pos += 5; } else if(text.indexOf('<a ',pos) == pos) { tmp = text.substring(pos); end = tmp.search(/>/); pos += end; } else if(text.indexOf('</a>',pos) == pos) { new_letter.innerHTML = '<br />'; pos += 3; } else new_letter.innerHTML = text.charAt(pos); document.getElementById('box_text').appendChild(new_letter); max_pos = text.length - 1; pos++; call = 'show_text("' + text + '",' + pos + ');'; if(pos <= max_pos) setTimeout(call,parseInt(config['text_speed'])); //else ende } return false; } </script> </head> <body> <div id="box_text"> bla </div> <br /><br /> <input type="button" name="none" value="klick mich" onclick="show_text('Hallo! Ich bin ein lustiger Text!');alert('blubb');"/> </body> </html> Vielen dank im Voraus LG Micha
__________________
Walter IT-Services Michael Walter http://www.walter-it.de http://blog.walter-it.de |
Sponsored Links |
Sponsored Links |
|
|||
Vielen Dank für den Tip.
Leider sehe ich nicht, wie diesen auf mein Problem anwenden kann. Im Prinzip gibt es innerhalb der Funktion selbst keinen Code nach dem TimeOut. Der Code oben ist nur ein Test-Case. Letzendlich wird die show_text()-Funktion aufgerufen und danach geht eine Menge anderer Code weiter (Aufruf ist innerhalb der Methode einer Klasse). Verschiedene "sleep()"-Nachbauten haben es leider auch nicht gebracht, da dort der Effekt leider nicht mehr zur Geltung kommt, da der Brwoser-Tab hängt, bis die letzte Rekursion abgeschlossen ist. Bin gerne noch für Anregungen und weiter Tips offen. LG Micha
__________________
Walter IT-Services Michael Walter http://www.walter-it.de http://blog.walter-it.de |
|
||||
Du könntest in deiner Funktion ein Event feuern, wenn diese komplett fertig ist. Für die Javascript-Funktionen die davon abhängig sind und nicht vorher ausgeführt werden sollen, registrierst du dann einen ensprechenden Event-Listener.
|
|
||||
Genau! Du musst dein Skript Eventgesteuert ablaufen lassen und mit closures und Funktionsreferenzen arbeiten. So kommst du nicht weiter.
Dein call müßte z.b. so aussehen: Code:
var call = function() { show_text(text, pos);}; if(pos <= max_pos) setTimeout(call,parseInt(config['text_speed'])); |
|
|||
Zitat:
Da muss ich mich mal mit den Event-Handlern beschäftigen. Ich denke mal, dass es bei scriptaculous ähnlich gemacht wird. Denn dort hat man auch immer den afterFinish-Callback. Der muss ja auch durch irgendwas ausgelöst werden. Zitat:
Deinen Vorschlag habe ich irgenwo auch schon einmal gelesen. Das Problem wurde damit aber leider nicht gelöst :/ LG Micha
__________________
Walter IT-Services Michael Walter http://www.walter-it.de http://blog.walter-it.de |
|
|||
Dein Beispiel aus dem ersten Post mit Callback-Möglichkeit und Closure.
Code:
<?php header('content-type: text/html; charset=utf-8'); ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de"> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <title>Background Click</title> <link rel="stylesheet" type="text/css" href="reset.css" /> <script type="text/javascript"> var config = new Array(); config['debug'] = 'false'; config['text_speed'] = 30; function show_text(text, callback, pos) { if(config['debug'] != 'true' && text == 'kein JSON') { document.getElementById('box_text').innerHTML = 'Ein Fehler ist aufgetreten'; return false; } if(config['text_speed'] == 'instant') document.getElementById('box_text').innerHTML = text; else { a_pos = text.indexOf('<a ',pos); if(typeof pos == 'undefined') pos = 0; pos = parseInt(pos); // if(pos == 0) block_box(text); document.getElementById('box_text').innerHTML = text.substr(0,pos); new_letter = document.createElement('span'); bla = text.indexOf('<br />'); blubb = text.indexOf('<br />',pos); if(text.indexOf('<br />',pos) == pos) { new_letter.innerHTML = '<br />'; pos += 5; } else if(text.indexOf('<a ',pos) == pos) { tmp = text.substring(pos); end = tmp.search(/>/); pos += end; } else if(text.indexOf('</a>',pos) == pos) { new_letter.innerHTML = '<br />'; pos += 3; } else new_letter.innerHTML = text.charAt(pos); document.getElementById('box_text').appendChild(new_letter); max_pos = text.length - 1; pos++; call = (function (text, callback, pos) { return function () { show_text(text, callback, pos); }; })(text, callback, pos); if(pos <= max_pos) setTimeout(call,parseInt(config['text_speed'])); else { callback(); } } return false; } </script> </head> <body> <div id="box_text"> bla </div> <br /><br /> <input type="button" name="none" value="klick mich" onclick="show_text('Hallo! Ich bin ein lustiger Text!', function () { alert('blubb'); });"/> </body> </html> Geändert von mermshaus (22.07.2011 um 19:08 Uhr) |
|
||||
Code:
function show_text(text, onend){ if(config['debug'] != 'true' && text == 'kein JSON') { document.getElementById('box_text').innerHTML = 'Ein Fehler ist aufgetreten'; return false; } if(config['text_speed'] == 'instant') document.getElementById('box_text').innerHTML = text; else { if(typeof pos == 'undefined') pos = 0; function lauftext() { a_pos = text.indexOf('<a ',pos); pos = parseInt(pos); // if(pos == 0) block_box(text); document.getElementById('box_text').innerHTML = text.substr(0,pos); new_letter = document.createElement('span'); bla = text.indexOf('<br />'); blubb = text.indexOf('<br />',pos); if(text.indexOf('<br />',pos) == pos) { new_letter.innerHTML = '<br />'; pos += 5; } else if(text.indexOf('<a ',pos) == pos) { tmp = text.substring(pos); end = tmp.search(/>/); pos += end; } else if(text.indexOf('</a>',pos) == pos) { new_letter.innerHTML = '<br />'; pos += 3; } else new_letter.innerHTML = text.charAt(pos); document.getElementById('box_text').appendChild(new_letter); max_pos = text.length - 1; pos++; if(pos <= max_pos) window.setTimeout(lauftext,parseInt(config['text_speed'])); else onend(); } window.setTimeout(lauftext,parseInt(config['text_speed'])); } return false; } HTML-Code:
<input
type="button"
name="none"
value="klick mich"
onclick="show_text('Hallo! Ich bin ein lustiger Text!', function() {alert('blubb');})">
Geändert von protonenbeschleuniger (22.07.2011 um 19:28 Uhr) |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
wieso wartet die funktion nicht | css anfaenger | CSS | 1 | 17.08.2010 14:29 |
[PROTOTYPE] Funktion erst beenden, wenn Ajax Aufruf abgeschlossen ist | naitsab | Javascript & Ajax | 3 | 09.04.2009 16:41 |
Code einer bestehenden Funktion hinzufügen | cybertron | Javascript & Ajax | 13 | 01.01.2009 16:53 |
Funktion gibt Array nicht zurück | Schneemann | Serveradministration und serverseitige Scripte | 8 | 05.05.2008 02:14 |
[PHP] Funktion zum Optimieren von CSS | Floele | Serveradministration und serverseitige Scripte | 2 | 13.08.2005 11:31 |