Toon posts:

[JS] this object kwijt na openen externe window

Pagina: 1
Acties:

Verwijderd

Topicstarter
Hey folks,

Ik heb het volgende probleem:
Ik wil een image invoegen vanuit een window aangeroepen door de editor.

Ik heb in de huidige window (opener) het volgende staan:
code:
1
2
3
4
5
6
7
8
9
10
11
Editor.prototype.storeCursorLocation = function()
{
    this.CursorPos = document.selection.createRange().duplicate();
    alert(this.CursorPos);
}

Editor.prototype.insertImage = function(sImage)
{
    alert(this.CursorPos);
    this.CursorPos.pasteHTML("[img]\""+sImage+"\"[/img]");
}

Die alert die in de functie storeCursorLocation geeft netjes Object terug alleen wanneer ik dus vanuit de geopende window die insertImage aanroep dan is die alert ineens 'undefined'!

Ik heb al een tijdje gezocht hier en ik dacht aan contructie als var self = this; maar dan is this nog steeds niet bekend.

InsertImage wordt zo aangeroepen:
code:
1
onclick="opener.editor.insertImage('plaatje.jpg');


Iemand?

Verwijderd

Op zich heel logisch maar dat is ook het probleem met dit soort issues. Op het moment dat jij vanuit je popup window die method aanroept verwijst this, niet naar je editor object (waar het waarschijnlijk naartoe verwees).

Als je dus in je popup dit hebt staan

code:
1
[img]""[/img]


Dan verwijst alert(this.CursorPos); naar je img. Wat je dus kunt doen, is in die onclick een referentie opnemen naar je geinstantieerde object van Editor.

Dus als je in je opener dus iets hebt als:
var editor = new Editor();

Dan heb je dus een referentie naar je instantie. Voordat ik bullshit bingo aan het spelen ben, is opener.editor.insertImage een static methode, of een methode van een instantie? Als het een static is klopt het probleem wat je hebt, met een referentie naar een instantie zou het gewoon moeten werken.

[ Voor 24% gewijzigd door Verwijderd op 11-07-2005 16:54 ]


Verwijderd

Topicstarter
Verwijderd schreef op maandag 11 juli 2005 @ 16:50:
Wat je dus kunt doen, is in die onclick een referentie opnemen naar je geinstantieerde object van Editor.
Zou je dit kunnen toelichten?

Verwijderd

Ik ga er even vanuit dat je een editor hebt.

function editor(){
// basis klasse editor
}

Die je vervolgens voorziet van methodes zoals:

editor.prototype.insertImage = function(sImagePath){}

In de openener pagina maak je een nieuwe editor aan:
var mijnEditor = new editor();

En daar zou je dus methodes mee kunnen uitvoeren:
mijnEditor.insertImage('http://www.domein.nl/image.gif');

Zolang je de methode aanroept, als een methode van mijnEditor (een instantie van de editor klasse) zal een this referentie binnen insertImage() ook verwijzen naar mijnEditor tenzij je additionele zaken gaat doen zoals events attachen, settimeout, setinterval etc.

Dus in de popup een aanroep doen met window.opener.mijnEditor.insertImage(); zal worden uitgevoerd op de instantie mijnEditor.

Echter als het een statische functie is, dus niet behorende bij een instantie, dan verwijst this gewoon naar de image.

Ik weet niet in hoeverre je een voorbeeld kan laten zien, dan wordt het wellicht allemaal wat helderder.

[ Voor 7% gewijzigd door Verwijderd op 11-07-2005 18:07 ]


Verwijderd

Topicstarter
Je interpretatie over mijn code klopt als een bus. Ik roep de code idd vanuit de image tag en had al het vermoeden dat this naar de image ging verwijzen alleen moet hij toch echt de instance Editor pakken want opener.editor.insertImage() is een prototype van Editor. (als ik dat goed zeg zo)

Ik maak de instance aan met de body onload, editor = new Editor();

Ik ben nu niet thuis maar zal straks even kijken op het wel werkt met window.opener. Heb alleen het vermoeden dat dat weinig uitmaakt :?

Voorbeeldje gaat niet lukken, misschien later vanavond als dat nodig is.

Verwijderd

Topicstarter
Na jouw post nog beter bekeken te hebben ging ik de attachevents die in de aanroep van Editor geset werden eruit halen. Het is wonderbaarlijk... het werkt nu gewoon!

Maar toch he, in de aanroep staat/stond dit:
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
function Editor()
{
    this.EditorId = "RTEditor";
    this.DocumentWidth = document.body.clientWidth;
    this.DocumentHeight = document.body.clientHeight;
    
    this.TheEditor = this.getEditor();
    this.TheEditor.contentEditable = true;
    this.TheEditor.className = "editor";
    
    this.TheEditor.attachEvent("onclick", this.storeCursorLocation);
    this.TheEditor.attachEvent("onkeyup", this.storeCursorLocation);
}

Die insertImage wordt pas veel later aangeroepen. Waarom zit attachEvent dan alsnog in de weg?

Verwijderd

Al geloof ik je meteen, ik zou niet weten waarom die twee events van invloed zouden moeten zijn. Zover ik uit de naamgeving kan opmaken doen ze allebei niets anders dan een waarde zetten die de cursor positie op het moment van dat event opslaan.

Verwijderd

Topicstarter
Vreemd idd.
Het enige wat in storeCursorLocation staat is dit:
code:
1
2
3
4
Editor.prototype.storeCursorLocation = function()
{
    this.CursorPos = document.selection.createRange().duplicate();
}

Lijkt me niks geks :)
Maargoed, ik heb iig weer iets vaags geleerd en daar gaat het toch om :+ Thanks!
Pagina: 1