CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

hansa Nybegynder

22. maj 2004 - 13:47 Der er 14 kommentarer og
1 løsning

Tildel style i iframe

Hej eksperter,

Jeg er ved at lave min egen WYSIWYG editor, og har et problem med at tildele et style til en markeret tekst.
Her er et udsnit af hvad jeg har lavet:

java script:
---------------------------
function AddStyle(cssStyle)
{
var sel = content.document.selection;
var range = sel.createRange();
var theHtml = range.htmlText;

range.pasteHTML('<span class="' + cssStyle + '">'+ theHtml +'</span>');
}

HTML:
---------------------------
<iframe id="content" src="blank.html" width="100%" height="200"></iframe>
<a href="#" onclick="AddStyle('code')">Test</a>

Funktionen virker uden fejl - den tildeler også <span> tag'et til content, men i iframe vises style'en ikke.
Hvis jeg derimod skriver:

range.pasteHTML('<span style="background-color: red">'+ theHtml +'</span>');

Så vises den røde farve som baggrund.

Jeg har prøvet at gennemse mange andre WYSIWYG editors, men har ikke kunne finde løsningen. Så links til andre editor ønskes ikke!

Nogen der kan se fejlen?

Synes godt om

olebole Juniormester

22. maj 2004 - 14:27 #1

<ole>

Koden virker kun, hvis du i dokumentet, der ligger i din editor-frame, har et stylesheet, hvor klassen er defineret

/mvh
</bole>

Synes godt om

hansa Nybegynder

22. maj 2004 - 14:30 #2

Det glemte jeg selvølgelig at kopiere med.

I min header har jeg:
<link href="StyleSheet.css" type="text/css" rel="stylesheet">

I stylesheet er klassen:
.code
{
color : #663300;
background: #eeeeee;
font-family: Verdana, Arial, Sans-Serif;
font-size : 11px;
line-height : 20px;
padding : 5px 10px;
margin : 10px 20px;
border : 1px dashed #999999;
}

Synes godt om

olebole Juniormester

22. maj 2004 - 14:47 #3

Hvilket dokument linker til det stylesheet?

Synes godt om

hansa Nybegynder

22. maj 2004 - 14:49 #4

Jeg har kun 2 filer i øjeblikket: index.html og StyleSheet.css.
Begge filer ligger i samme mappe.

index.html linker til StyleSheet.css med følgende tag:
<link href="StyleSheet.css" type="text/css" rel="stylesheet">

Synes godt om

hansa Nybegynder

22. maj 2004 - 14:53 #5

Jeg har også prøvet at lægge stylesheet direkte ind i index.html, men det hjalp heller ikke.

Synes godt om

roenving Novice

22. maj 2004 - 15:55 #6

Du skal lægge stylesheetet ind i blank.html ...

Synes godt om

hansa Nybegynder

22. maj 2004 - 16:10 #7

> roeving
Jeg prøvede at kopiere style over i blank.html, men det gjorde inden forskel.

blank.html:
--------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title></title>
<style type="text/css">

</style>
</head>
<body>
</body>
</html>

Synes godt om

roenving Novice

22. maj 2004 - 16:14 #8

Hvilken slags elementer har du i din markerede tekst ?-)

For en style fra et element vil ikke nødvendigvis blive arvet ind i et andet, f.eks. vil en del tekst-egenskaber blive betragtet som særligt tilhørende f.eks. tabeller og links !-)

Synes godt om

hansa Nybegynder

22. maj 2004 - 16:20 #9

Jeg tester kun med tekst.
Du kan evt. se koden på siden her:
http://www.hojgard.dk/SimpleEditorv3.html

Synes godt om

roenving Novice

22. maj 2004 - 16:33 #10

En Vis Kilde på content-elementet viser, at det er fuldstændig tomt !-)

-- og det er fordi din init-funktion ganske effektivt sletter alt indhold:

function Init(){
// Tjekker brugerens browser.
ValidateBrowser();

frames.content.document.designMode="On";
frames.content.document.open(); //her slettes indholdet af dokumentet
frames.content.document.write(""); //og disse linjer gør bare arbejdet færdigt
frames.content.document.close(); //Hertil, og så sætter du noget
frames.content.document.body.style.fontFamily = "Tahoma";
frames.content.document.body.style.fontSize = "11pt"
DoFocus();
}

-- kan ikke lige på en studs sige, hvad du skal gøre, men måske en eller anden ...

Synes godt om

hansa Nybegynder

22. maj 2004 - 16:37 #11

Jeg har simpelthen stiret mig blind på problemet.
Nu virker det efter jeg har kommenteret følgende ud:

//frames.content.document.open();
//frames.content.document.write("");
//frames.content.document.close();
//frames.content.document.body.style.fontFamily = "Tahoma";
//frames.content.document.body.style.fontSize = "11pt"

Tak for hjælpen roenving!
Smider du ikke et svar, så du kan få dine vejfortjente point?

Synes godt om

roenving Novice

22. maj 2004 - 16:44 #12

Så har du også nogle fejl i designMode-funktionen, hvor du forsøger at kalde this.btnDesign, som jo ikke eksisterer, det skal du også få rettet !-)

-- og 200 point er vildt overdrevet, behold de fleste selv (og check en anden gang mod standard-'betalingerne': 60, 30 og 15 p. !-)

-- også ole skal vel have point, for uden koden at kigge, på var det jo fuldstændig korrekt svaret, og i hvert fald uigennemskueligt !o]

Synes godt om

hansa Nybegynder

22. maj 2004 - 16:48 #13

Jeg har fjernet det meste designMode - det skal ikke fra muligt at slå fra.

Jeg ved godt 200 point er meget, men har valgt det fordi jeg har bøvlet MANGE timer for at få den funktion til at virke - havde næsten opgivet.

Selvfølgelig bør ole også få point for hans hjælp.

Lægger i et svar, så jeg kan komme af med nogle point ;-)

Synes godt om

roenving Novice

22. maj 2004 - 16:50 #14

Nå, ja, man skal også trykke på den der lille knap ude i siden !-)

-- velbekomme '-)

Synes godt om

roenving Novice

25. maj 2004 - 11:22 #15

-- og tak for point ;~}

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Sæt vindue størrelse Af poulmadsen i JavaScript	1	08/10/202417:18	13/10/202412:33
Opgavestyring Af ingeman i JavaScript	1	15/09/202416:06	15/09/202420:40
Returner ikke alt Af ingeman i JavaScript	13	26/06/202414:40	01/07/202417:00
Vis og skjul sektioner - virker kun på den første sektion Af nemlig i JavaScript	4	24/06/202422:50	26/06/202420:33
Hente og gemme Cookies like this. Af DanishBear i JavaScript	6	04/06/202416:23	05/06/202414:23

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS