[js] onbeforeunload wordt onnodig getriggerd.

[Michali]

Ik ben bezig met het maken van een component voor het bewerken van HTML tekst. Nu heb ik een check ingebouwd die een waarschuwing geeft als het window gesloten wordt zonder te saven. Dit doe ik door een tekst te returnen aan het onbeforeunload event. En dat alleen als er een vlag is gezet (zeg boolean variable changed). Nu ben ik ook bezig met een custom context menu waarin acties uit te voeren zijn (zoals bold, italic, copy etc.) via tekst links in plaats van icons zoals in de toolbar boven het iframe waarin de tekst bewerkt wordt.

Het probleem is dat als er op een linkje geklikt wordt in het context menu, dat dan event onbeforeunload getriggerd wordt. Als de vlag al gezet is krijg je dus een waarschuwing die je eigenlijk alleen hoort te krijgen als het venster gesloten wordt. Dit is echter alleen het geval als het linkje ook werkelijk een href attribuut bezit. De linkjes zijn allen zo gevormd:

code:

<a href="javascript://" onclick="actie();">actie tekst</a>

Nu zul je denken, nou zo opgelost, halen we het href attribuut weg. Dat gaat dus ook niet werken omdat dan, heel vreemd, de actie verkeerd uitgevoerd wordt omdat de iframe dan de focus verliest. De iframe verliest dus geen focus als er op een linkje met href wordt geklikt of een img. (ik zou ook niet weten waarom dat is).

Ik gebruik verder twee functies voor het zetten van de vlag. Dat zijn flag() en unflag(). Nu dat ik het op te kunnen lossen door voor de actie unflag() aan te roepen: onclick="unflag();actie();" en dan de flag() weer zetten aan het einde van de actie. Dat wilde ook niet werken omdat het event pas na alle events van de link zelf wordt getriggerd.

Hoe ik het nu heb opgelost is door gebruik te maken van de setTimeout functie en zo de flag pas te zetten nadat het onbeforeunload event is getriggerd. Werkt wel maar is niet echt een mooie oplossing. Mischien iemand die wel eens voor de zelfde situatie heeft gestaan en het beter heeft opgelost?

[crisp]

geen anchor gebruiken, maar een ander element met een onclick, of een return false toevoegen aan de onclick actie zodat de href niet uitgevoerd wordt.

[Bosmonster]

href is verplicht attribuut, maar er hoeft niks in te zitten, zeker niet al je alleen al het onclick-event gebruikt.

code:

<a href="" onclick="actie();return false;">actie tekst</a>

[Michali]

crisp schreef op 25 juni 2004 @ 15:11:
geen anchor gebruiken, maar een ander element met een onclick, of een return false toevoegen aan de onclick actie zodat de href niet uitgevoerd wordt.

Zoals ik al zei verliest het iframe geen focus bij het klikken op een anchor met href attribuut of een img. Bij alle andere element gebeurt dat wel, waarom dat is, weet ik niet. Ik heb de focus nodig om acties uit te kunnen voeren.

Nu zul je denken, nou zo opgelost, halen we het href attribuut weg. Dat gaat dus ook niet werken omdat dan, heel vreemd, de actie verkeerd uitgevoerd wordt omdat de iframe dan de focus verliest. De iframe verliest dus geen focus als er op een linkje met href wordt geklikt of een img. (ik zou ook niet weten waarom dat is).

Bosmonster schreef op 25 juni 2004 @ 15:19:
href is verplicht attribuut, maar er hoeft niks in te zitten, zeker niet al je alleen al het onclick-event gebruikt.

code:

<a href="" onclick="actie();return false;">actie tekst</a>

Ik heb even die javascript:// weggehaald. Maar het event wordt nog steeds getriggerd. IE denkt hoe dan ook dat als er op een anchor geklikt wordt die een href attribuut bezit, dat de pagina dan unload waardoor dus weer het event getriggerd wordt.

Edit: als ik een leeg href attribuut gebruik wordt er wel gelinked. Ik moet dus wel javascript:// gebruiken. Ik ben er nog niet uit dus.

_{(en de titel is verkeerd, moet eigenlijk onbeforeunload zijn )}

[ Voor 12% gewijzigd door Michali op 25-06-2004 16:58 ]

[Bosmonster]

Eh... je moet niet alleen javascript:// weghalen.. het gaat juist om de return false;

En ik kan je met 99,9% zekerheid zeggen dat het aanklikken van een juist afgehandeld javascript-linkje geen onbefureonload triggered...

[Michali]

ah nie gezien ff proberen

Edit:

Bosmonster, mag ik je heel erg bedanken! Ik heb nog veel te leren op dit gebied, weer wat geleerd.

[ Voor 71% gewijzigd door Michali op 25-06-2004 18:00 ]

[Verwijderd]

Bosmonster schreef op 25 juni 2004 @ 15:19:
href is verplicht attribuut, maar er hoeft niks in te zitten, zeker niet al je alleen al het onclick-event gebruikt.

code:

<a href="" onclick="actie();return false;">actie tekst</a>

is helemaal niet verplicht, alleen als ie er niet is ben je in ie je handje kwijt, wat mensen soms niet willen.

maar sowieso als je geen href hebt en alleen een onclick actie is het semantisch nut van een a helemaal ver te zoeken

[bRight]

ach.. style="cursor: pointer; cursor: hand;" toevoegen en je handje is terug
misschien kan je uit semantisch oogpunt beter een span gebruiken oid.

[Michali]

Verwijderd schreef op 25 juni 2004 @ 18:13:
[...]

is helemaal niet verplicht, alleen als ie er niet is ben je in ie je handje kwijt, wat mensen soms niet willen.

maar sowieso als je geen href hebt en alleen een onclick actie is het semantisch nut van een a helemaal ver te zoeken

Ik probeerde het eerst op te lossen met een div element. Nu gebruik ik een a tag waarvan de de display waarde op block zet. De reden waarom in naar een a element ben gegaan is omdat het iframe waarin de html bewerkt wordt, focus verliest als er op een element wordt geklikt. En juist die focus heb ik nodig om execQueryCommand acties ed. uit te voeren. Ik kan natuurlijk wel de focus terug zetten, maar dan staat komt ie wel helemaal aan het begin van de tekst en niet op de plek waar de actie eigenlijk uitgevoerd had moeten worden. Ik heb ontdekt dat je de focus niet verliest als er geklikt wordt op of een img element, of een a element met een href attribuut.

bRight schreef op 25 juni 2004 @ 18:31:
ach.. style="cursor: pointer; cursor: hand;" toevoegen en je handje is terug
misschien kan je uit semantisch oogpunt beter een span gebruiken oid.

cursor: pointer; werkt overigens ook perfect in IE dus waarom zou je dan nog cursor: hand; toevoegen?

En ik gebruik toch liever een a element omdat in IE de :hover selector alleen op een a element werkt. Ik vind het dan een beetje overdone om met onmouseover en onmouseout events te gaan werken als het ook zo kan. En sematisch gezien zit het zo ook wel goed.

[ Voor 10% gewijzigd door Michali op 26-06-2004 12:12 ]

[crisp]

cursor:pointer werkt pas vanaf IE6, en verder het gebruik van een anchor: tsja, IE is gewoon behelpen...