[JavaScript] Plakken als plaintext

[gvanh]

Hallo daar!

In een CMS-achtige omgeving, waarin een Rich-text DHTML/JavaScript gestuurde editor is opgenomen, probeer ik een functie te maken, die vergelijkbaar is met de 'Paste special' functie in Word. Dit is gelukt met de volgende functie:

-----------------------------------------------------------------------

function pasteText () {

str = window.clipboardData.getData("Text");

putStr(str); // een andere functie die 'str' in de pagina plaatst

} // end of function pasteText()

-----------------------------------------------------------------------

Mijn probleem echter is, dat in de aldus verkregen string ook alle 'newlines' zijn verwijderd ... en deze zou ik wel graag gepreserveerd hebben.

De vraag is dus of dit mogelijk is, met een (combinatie van) JavaScript functies.

Ik hoop dat iemand me verder kan helpen.

Groeten,

Robert-Jan.

[André]

Misschien eerst met een search/replace de newlines vervangen door <br>'s

[Bosmonster]

En vergeet drag/drop niet. En het feit dat je ook kunt knippen/plakken BINNEN de editor, wat dan ook niet meer werkt (niet handig )

[gvanh]

Hmmm... ik heb een aparte knop gemaakt voor het 'Paste plaintext' gebeuren... de rest van het plakken werkt op de standaard manier ... daar dus geen problemen. Als een gebruiker het wil, kan hij nog steeds MET opmaak plakken.

In eerste instantie dacht ik ook: gewoon clipboard tekst pakken, en dan <br>'s vervangen door newlines.

ECHTER!

De method window.clipboardData.getText(TYPE) heeft als mogelijke TYPES alleen TEXT (da's dus de plaintext zonder HTML en zonder newlines) en URL (in dit verband niet interessant). Ik zou dus niet weten hoe ik de clipboardData INCLUSIEF html tags zou moeten achterhalen.

Ideeen?

[Verwijderd]

Dat gaat je nooit lukken met het clipboardData object! Ik werk als freelancer voor InterSpire, een bedrijf dat ook zo'n Editor maakt, en ik weet hoe zij het opgelost hebben: ranzig, maar effectief.

Neem een ander IFRAME en maak die zo klein dat hij niet te zien is. Wanneer de gebruiker plakt, moet je in dat verborgen frame plakken en vervolgens de inhoud van het frame ophalen. Tada: je hebt je HTML code. Ranzig? Ja! Effectief? Zeker.

Een andere oplossing is er niet. Volgens mij is het ophalen van HTML van het clipboard verboden ivm beveiligingsproblemen.

[gvanh]

Aaaaah ... nuttige info, dank je!

Ik zag alleen net wel, dat wanneer ik de clipboardData plaintext in een JavaScript alert laat tonen, er wel degelijk sprake is van newlines! Deze worden dus wel onthouden.

Nu is het alleen zaak om dus de "\n" te vervangen door "<br>". Maar ik kom er niet helemaal uit hoe dit zou moeten. Hetgeen ik nu heb is:

pasteText.replace("\n", "<br>");

Maar dit werkt niet ... er verandert niets. Ook het zoeken naar "\\n" of "\r\n" geeft geen resultaat.

Wat doe ik fout?

[Bosmonster]

Nou ik weet het niet.. maar ik heb het toch eenvoudig zonder 'ranzigheid' voor elkaar gekregen met een simpele regexp op de text

code:

var cb = window.clipboardData.getData('Text');
cb = cb.replace (/</g, "<");
cb = cb.replace (/>/g, ">");
cb = cb.replace (/\n/g, "<br>");
var tr = document.selection.createRange();
tr.pasteHTML(cb);

Zomaar een klein stukje van wat hier gewoon werkt (paste de tekst met behoud van linebreaks).

Zelf heb ik het wat ingewikkelder, want ik wil niet dat mensen volledige opmaak kunnen plakken/slepen om de vorm van de site te behouden. En heb dus alle events afgevangen en ook gekeken of het slepen/kopieren niet intern plaats vindt.

[ Voor 71% gewijzigd door Bosmonster op 28-04-2004 12:23 ]

[gvanh]

Ah ... gunstig!

Heb je die regexp nog ergens voor me ... ook na veel klooien krijg ik het niet voor elkaar ...

--------------------------------------------

txt = txt.repalce("\n", "<br>");

txt = txt.replace("/\n/g", "<br>");

--------------------------------------------

De eerste vervangt alleen de eerste 'occurence' van "\n", de tweede doet helemaal niets ...

[Bosmonster]

Ff testen hoor of dit werkt als voorbeeld:

[edit]
nee dus.. cross-domein contenteditable mag nie

[ Voor 47% gewijzigd door Bosmonster op 28-04-2004 12:29 ]

[gvanh]

Aaah ... het is uiteindelijk toch nog gelukt ... Uiteindelijk de oplossing:

-----------------------------------------------

cbTxt = window.clipboardData.getData("Text");

cbTxtArray = cbTxt.split("\n");

pasteTxt = "";

for ( i in cbTxtArray ) {

pasteTxt += "<p>" + cbTxtArray[i] + "</p>";

}

putStr(pasteTxt);

-----------------------------------------------

Zo staan er ook meteen mooie paragraaf tags (<p>) om de alinea's heen ...

[Verwijderd]

Doooo,

* Jorgen heeft weer eens verkeerd gelezen

Die oplossing van mij is bedoelt om de HTML van het clipboard te kunnen halen. Als je plakt vanuit Word, dan moet de opmaak gelijk blijven, alleen een aantal ranzige tags moet gefilterd worden.