Toon posts:

[JS] IFrame & designMode

Pagina: 1

Acties:

74 views sinds 30-01-2008
Reageer

dinsdag 6 mei 2003 17:27

Acties:

Verwijderd

Topicstarter

Hallo.

Ik heb een IFrame met in de body een onpaste event.
Alles werkt prima in IE 5.

Maar als ik IE 6 gebruik werkt het opeens niet meer.
Alles werkt goed zolang de designMode niet op On staat.

Nu zeggen ze msdn:
You cannot execute script when the value of the designMode property is set to On.

http://msdn.microsoft.com...properties/designmode.asp

Maar waarom werkt het in IE 5 wel en niet in IE 6?
En ik wil dat het werkt met beide versies, heeft iemand een idee hoe ik het werkend krijg in IE 6?

dinsdag 6 mei 2003 17:36

Acties:

Bosmonster

*zucht*

Hmm.. ik gebruik exact hetzelfde voor onze editor en daar werkt het gewoon prima in IE6. De body van het te wijzigen document heeft een onpaste-event.

dinsdag 6 mei 2003 17:36

Acties:

UniCache2

Dit moet gewoon kunnen, geef eens wat code?

dinsdag 6 mei 2003 18:58

Acties:

Verwijderd

Topicstarter

Ik heb de code niet bijdehand, maar ik zal zo ff wat maken.
Wel een probleempje, ik heb geen IE6 bijdehand...
en een 56k modempje, dus vraag niet te downloaden

dinsdag 6 mei 2003 20:10

Acties:

Verwijderd

Topicstarter

Ik heb ff wat getyped en dit werkt in IE5.
Maar dit kreeg ik niet werkend in IE6

input.html

code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE></TITLE>
<script language="Javascript">
function edit()
{
    OpmaakTekst.document.designMode = 'On';
}
</script>
</HEAD>

<BODY onload="edit()">
<table>
    <tr align="left">
        <td>
            <iFrame name="OpmaakTekst" src="iframe.html">
            </iFrame>
        </td>
    </tr>
</table>
</BODY>
</HTML>

iframe.html

code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>

<BODY onpaste="alert('test')">
</BODY>
</HTML>

[ Voor 29% gewijzigd door Verwijderd op 06-05-2003 20:12 ]

dinsdag 6 mei 2003 20:21

Acties:

bRight

digitaal

code:

1	document.Opmaaktekst.document.designMode = 'On';

Heb hier ook geen ie6 maar volgens mij heeft de iframe ook een document object..

dinsdag 6 mei 2003 20:25

Acties:

Verwijderd

Scripts werken niet in het document wat je aan het editten bent. Je zult het via het parent document moeten gaan aanpakken.
Voorbeeldje:

code:

setTimeout('test2()',2000);
function test2(){
window.frames["OpmaakTekst"].document.body.onpaste=test;
}
function test(){
alert('test');
}

Ik zou ook denken dat het via de onload event handler van de frame zou moeten kunnen, maar dat kreeg ik niet aan de praat

dinsdag 6 mei 2003 20:32

Acties:

Verwijderd

Topicstarter

Thanx!

Het werkt iig in IE5, nou nog in IE6 proberen

Weet je toevallig ook waarom mijn manier wel in IE5 werkt en niet in IE6?

dinsdag 6 mei 2003 20:43

Acties:

Verwijderd

Ah, het linkje gevonden waar het staat:
microsoft

You cannot execute script when the value of the designMode property is set to On.

Ik dacht al dat ik het ergens eens gelezen had.

(ervan uitgaande dat je het tegen mij had)
Waarom het wel werkt in IE5? Geen idee. Ze hebben de boel nogal omgegooid vanaf IE5.5. Het zal wel daarmee te maken hebben.

woensdag 7 mei 2003 11:49

Acties:

Bosmonster

*zucht*

Ik heb absoluut geen problemen in IE6 met het runnen van scripts in het document dat ik edit. Ik gebruik het volgende document als editor-template zeg maar, wat ik vervolgens vul met content uit de DB om te editen (via innerHTML). Dit script zorgt ervoor dat je geen html kan pasten (werkt nog niet helemaal optimaal, maar scheelt een hoop gezeik in ieder geval

)

code:

<html>
<head>
<link rel="stylesheet" type="text/css" href="content.css">
<script type="text/javascript">
function evtPaste() {
    event.returnValue = false;
    var cb = window.clipboardData.getData('text');
    var tr = document.selection.createRange();
    if (cb) tr.pasteHTML(cb);
}
</script> 
</head>
<body contenteditable onpaste="evtPaste()">
</body>
</html>

edit.. oops

[ Voor 94% gewijzigd door Bosmonster op 07-05-2003 11:56 ]

woensdag 7 mei 2003 12:44

Acties:

Verwijderd

Topicstarter

Inmiddels heb ik IE6 geinstalleerd.
Het script aangepast zoals Martijn22 het heeft beschreven.
Werkt het wel local maar niet online???

Online heb ik nog steeds dezelfde problemen.
ff ter info:
Mijn cache staat uit.
Handmatig heb ik het nog een keer leeg gegooid.
De pagina een aantal x ge-ctrl-F5.
Mijn computer zelfs opnieuw opgestart....
en nog werkt het niet???

Zooooo raaaarrrrr...
werkt wel in IE5 en IE6 lokaal, maar niet IE6 online?

woensdag 7 mei 2003 12:48

Acties:

Verwijderd

Topicstarter

Zouden jullie aub willen kijken of het bij jullie we werkt en aub willen reageren met IE browser versie:
http://www.groot-ammers.com/forum/reactie.tpl.php?nr=15

Er moet een alert komen met de keycode als er een toets ingedrukt wordt.
En als je iets wilt plakken (via ctrl-v), dan moet er een alert komen dat dit niet kan.

[ Voor 19% gewijzigd door Verwijderd op 07-05-2003 13:03 ]

woensdag 7 mei 2003 14:12

Acties:

Verwijderd

Topicstarter

Kan niemand ff kijken

woensdag 7 mei 2003 14:13

Acties:

McVirusS

Verwijderd schreef op 07 mei 2003 @ 12:48:
Zouden jullie aub willen kijken of het bij jullie we werkt en aub willen reageren met IE browser versie:
http://www.groot-ammers.com/forum/reactie.tpl.php?nr=15

Er moet een alert komen met de keycode als er een toets ingedrukt wordt.
En als je iets wilt plakken (via ctrl-v), dan moet er een alert komen dat dit niet kan.

Ik kan gewoon dingen pasten en toetsen indrukken zonder dat er iets gebeurt. (IE6 onder XP Pro hier)

woensdag 7 mei 2003 14:35

Acties:

Verwijderd

Topicstarter

Huh...
ik heb ff de HTML bestanden gestript en nu werkt het wel

Het heeft nu dus weer met iets anders te maken...

woensdag 7 mei 2003 14:36

Acties:

Bosmonster

*zucht*

Nu ik erover nadenk.. ik had exact hetzelfde probleem met het via javascript zetten van designMode.. Uiteindelijk heb ik dus bovenstaande methode gekozen van het contenteditable attribuut, wat mijn problemen oploste..

Weet niet meer precies wat ik allemaal geprobeerd heb (heb er errug veel mee zitten prutsen), maar weet wel dat ik met geen mogelijkheid het onpaste-event aan de praat kreeg.

woensdag 7 mei 2003 15:06

Acties:

Verwijderd

Topicstarter

Ben er ook al lang mee bezig, maar ik ben ff code aan het verwijderen en terug zetten..
Het wordt steeds vager...

woensdag 7 mei 2003 15:15

Acties:

Verwijderd

Topicstarter

Probleem bekend, oplossing onbekend.
Zie hieronder.

[ Voor 100% gewijzigd door Verwijderd op 07-05-2003 15:32 ]

woensdag 7 mei 2003 15:26

Acties:

Verwijderd

Topicstarter

Ik denk dat het hier aan ligt:

code:

//Voordat de pagina geladen is (body onload) wordt deze functie aangeroepen.
function Init()
{
    //Maak object 'OpmaakTekst' geschikt om tekst op te maken.
    OpmaakTekst.document.designMode = 'On';

    //Alvast data op de clipboard zetten als de clipboard leeg is.
    //Anders werkt de execcommand.paste niet.
    if(window.clipboardData.getData('Text')==null || window.clipboardData.getData('Text')=='')
    {
        window.clipboardData.setData('Text', 'leeg');
    }
}

//Vertraging om onPaste en onKeyPress aan de iframe te koppelen.
setTimeout('Init2()',2000);

function Init2()
{
    //Functie uit laten voeren als er iets gepaste wordt in de iFrame
    window.frames["OpmaakTekst"].document.body.onpaste = schoonMaken;

    //Functie uit laten voeren als er op een toets gedrukt wordt in de iFrame
    window.frames["OpmaakTekst"].document.body.onkeypress = keyEnter;
}

Er zit een setTimeout('Init2()',2000); in die voor een vertraging zorgt.
Maar zonder die setTimeout krijg ik Init2() niet werkend...

Dit werkt niet iig, dan krijg ik een JS error

code:

function Init()
{
    //Maak object 'OpmaakTekst' geschikt om tekst op te maken.
    OpmaakTekst.document.designMode = 'On';

    //Functie uit laten voeren als er iets gepaste wordt in de iFrame
    window.frames["OpmaakTekst"].document.body.onpaste = schoonMaken;

    //Functie uit laten voeren als er op een toets gedrukt wordt in de iFrame
    window.frames["OpmaakTekst"].document.body.onkeypress = keyEnter;

    //Alvast data op de clipboard zetten als de clipboard leeg is.
    //Anders werkt de execcommand.paste niet.
    if(window.clipboardData.getData('Text')==null || window.clipboardData.getData('Text')=='')
    {
        window.clipboardData.setData('Text', 'leeg');
    }
}

woensdag 7 mei 2003 15:34

Acties:

Verwijderd

Topicstarter

Het ligt idd aan de setTimeout

Alleen hoe krijg ik de eerste code van hierboven zoals de tweede code alleen zonder JS error

ff ter duidelijkheid de error:
Error: 'window.frames.OpmaakTekst.document.body' is null or not an object
Code:0

[ Voor 31% gewijzigd door Verwijderd op 07-05-2003 15:39 ]

woensdag 7 mei 2003 15:39

Acties:

Bosmonster

*zucht*

Tja.. een vertraging is nooit echt de manier om erachter te komen of iets geladen is ja of nee natuurlijk

Je kunt zoiets alleen onload aan het document koppelen en onload die Iniet2() uitvoeren. Helaas kun je dus weer geen events koppelen aan het document als het nog niet geladen is, waardoor je in een nogal oneindig circeltje komt

Dat is de reden dat ik het gekozen voor een kant-en-klare content-template in het iframe (zie eerder). Hier kan ik aan koppelen wat ik wil en maakt voor de editor niks uit.

woensdag 7 mei 2003 15:50

Acties:

Verwijderd

Topicstarter

Maar als ik me niet vergis is <body contenteditable> pas bruikbaar vanaf IE5.5
en als ik het nu aan de praat krijg is het bruikbaar van IE5.

Ik wacht nog ff af tot vanavond of iemand nog een oplossing weet, want er moet toch een mogelijkheid zijn lijkt me

Ik weet het, ik ben erg eigenwijs en als ik naar jou (Bosmonster) geluisterd had, dan was ik allang klaar geweest, maarjah

woensdag 7 mei 2003 16:00

Acties:

Verwijderd

Als ik me niet vergis dan zou het zelfs in IE4 moeten werken

Misschien zou je zoiets kunnen proberen (niet getest)

code:

window.frames["OpmaakTekst"].onload=test2;
function test2(){
window.frames["OpmaakTekst"].document.designMode = 'On';
window.frames["OpmaakTekst"].document.body.onpaste=test;
}
function test(){
alert('test');
}

Dit scriptje dan wel na de iframe zetten.

woensdag 7 mei 2003 16:10

Acties:

Bosmonster

*zucht*

er is voor zover ik weet geen compatibility verschil tussen contenteditable en designMode. De ene is het attribuut en de ander de javascript property om hetzelfde te bereiken

Zie ook hier:

http://msdn.microsoft.com...diting/activateeditor.asp

En dan onderaan over script.

If you set the CONTENTEDITABLE attribute or contentEditable property on the body element, it's the same thing as setting the document's designMode property to "On." The designMode property cannot be used as an HTML attribute.

Hmm.. nog even de ondersteuning op gezocht.. en volgens MSDN is document.designMode inderdaad 5.0 en contenteditable 5.5+. Das mooi, want onze editor was toch al buggy onder 5.0

(ondersteunt wel meer dingen niet

)

[ Voor 69% gewijzigd door Bosmonster op 07-05-2003 16:15 ]

woensdag 7 mei 2003 16:28

Acties:

Verwijderd

Topicstarter

Verwijderd schreef op 07 May 2003 @ 16:00:
Als ik me niet vergis dan zou het zelfs in IE4 moeten werken

Misschien zou je zoiets kunnen proberen (niet getest)
code:
1
2
3
4
5
6
7
8
window.frames["OpmaakTekst"].onload=test2;
function test2(){
window.frames["OpmaakTekst"].document.designMode = 'On';
window.frames["OpmaakTekst"].document.body.onpaste=test;
}
function test(){
alert('test');
}
Dit scriptje dan wel na de iframe zetten.

De functie Init wordt al aangeroepen via de onLoad in de body van de iFrame.

woensdag 7 mei 2003 16:28

Acties:

Verwijderd

Topicstarter

Bosmonster schreef op 07 May 2003 @ 16:10:
er is voor zover ik weet geen compatibility verschil tussen contenteditable en designMode. De ene is het attribuut en de ander de javascript property om hetzelfde te bereiken

Zie ook hier:

http://msdn.microsoft.com...diting/activateeditor.asp

En dan onderaan over script.

[...]

Hmm.. nog even de ondersteuning op gezocht.. en volgens MSDN is document.designMode inderdaad 5.0 en contenteditable 5.5+. Das mooi, want onze editor was toch al buggy onder 5.0 (ondersteunt wel meer dingen niet )

Nee, das minder

woensdag 7 mei 2003 16:42

Acties:

Verwijderd

Nou, dit is een soort alternatief onload event. Dit scriptje checkt om de 500 ms of document.body aanwezig is. Op het moment dat deze aanwezig is, dan wordt het onpaste event geplakt aan de test functie.

HTML:

<body>
<iframe id="OpmaakTekst" src="test.html"></iframe>
<script type="text/javascript">
window.frames[0].document.designMode = 'On';
interval=setInterval('test2()',500);
function test2(){
if (window.frames["OpmaakTekst"].document.body){
window.frames["OpmaakTekst"].document.body.onpaste=test;
clearInterval(interval);
};
}
function test(){
alert('test');
}
</script>
</body>

Ik heb hier vroeger ook problemen mee gehad. Ik bedoel dat IE5 geen onload event handler oppakt voor frames. Ik weet niet of dat hier ook de oorzaak is van het weigeren van het uitvoeren van de onload event handler van het iframe.

woensdag 7 mei 2003 18:53

Acties:

Verwijderd

Topicstarter

Verwijderd schreef op 07 mei 2003 @ 16:42:
Nou, dit is een soort alternatief onload event. Dit scriptje checkt om de 500 ms of document.body aanwezig is. Op het moment dat deze aanwezig is, dan wordt het onpaste event geplakt aan de test functie.
HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<body>
<iframe id="OpmaakTekst" src="test.html"></iframe>
<script type="text/javascript">
window.frames[0].document.designMode = 'On';
interval=setInterval('test2()',500);
function test2(){
if (window.frames["OpmaakTekst"].document.body){
window.frames["OpmaakTekst"].document.body.onpaste=test;
clearInterval(interval);
};
}
function test(){
alert('test');
}
</script>
</body>
Ik heb hier vroeger ook problemen mee gehad. Ik bedoel dat IE5 geen onload event handler oppakt voor frames. Ik weet niet of dat hier ook de oorzaak is van het weigeren van het uitvoeren van de onload event handler van het iframe.

Dit krijg ik ook met geen mogelijkheid aan de praat....

donderdag 8 mei 2003 00:08

Acties:

Verwijderd

Huh? Meen je dat?
Ik heb een voorbeeldje online gezet. Die werkt toch wel bij jou?
http://home.hccnet.nl/m.wargers/test/Untitled.htm
Je krijgt dan toch een alert bij een plakbewerking?

donderdag 8 mei 2003 10:05

Acties:

Verwijderd

Topicstarter

Het werkt idd!!

Ik ga nog ff puzzelen, bedankt!

Pagina: 1

Reageer