Textarea Warp met javascript
Ik weet dat het phphulp is maar mischien kan iemand mij helpen met het volgende
Ik heb gezocht naar een javascript wat er automatisch voorzorgd dat als je op een regel van een textarea meer dan een x aantal karakters typt hij automatisch een \n in voegd en naar de volgende regel springt.
Het probleem is dat hij nu midden in een woord afbreekt
Nu zou ik willen vragen of er iemand weet hoe je het script aan kan passen dat hij niet midden in een woord afbreekt maar terug gaat naar de laatste spatie in de zin daar een \n invoegd en alles na deze spatie onthoud en op de volgende regel zet.
Waarom ik de wrap functie niet gebruik als ik de standaard wrap functie gebruik dan neemt de hoofdletter H meer ruite inbeslag dan de kleine letter j.
Als ik cols="10" mee geef en wrap="hard"
zie ik als ik aan typen ben in de textarea
HHHHHHH
HH
terwijl als ik het verzend het wel op eenregel in de database komt
Ik wil dus zien zoals het in de database komt en later ook op internet.
<script>
<html>
<head>
<style>
textarea{font-family:verdana, arial; font-size:10px; height: 100px;}
#preview{font-family:verdana, arial; font-size:10px; width:300px; height: 100px; border:1px solid #000000; background-color:#cccccc; color:#8F3E3E; overflow:auto;}
</style>
<script>
function showpreview(){
contenuto_testo=document.getElementById("testo").value;
// trasformo a capo in <br/>
contenuto_testo=contenuto_testo.replace(/\n/g,"<br/>");
document.getElementById("preview").innerHTML=contenuto_testo;
}
</script>
<SCRIPT LANGUAGE="JavaScript">
<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->
<!-- Begin
function showLines(max, text) {
max--;
text = "" + text;
var temp = "";
var chcount = 0;
for (var i = 0; i < text.length; i++) // for each character ...
{
var ch = text.substring(i, i+1); // first character
var ch2 = text.substring(i+1, i+2); // next character
if (ch == '\n') // if character is a hard return
{
temp += ch;
chcount = 1;
}
else
{
if (chcount == max) // line has max chacters on this line
{
temp += '\n' + ch; // go to next line
chcount = 1; // reset chcount
}
else // Not a newline or max characters ...
{
temp += ch;
chcount++; // so add 1 to chcount
}
}
}
return (temp); // sends value of temp back
}
// End -->
</script>
</head>
<body>
<form>
<textarea name="test" id="testo" cols="20" onKeyPress="document.getElementById('preview').value = showLines(10, this.form.test.value)" onkeyup="document.getElementById('preview').value = showLines(10, this.form.test.value)" onkeyup="showpreview()"></textarea>
</form>
<br/>Preview:<br/>
<form name"test" id="test">
<textarea name="preview" id="preview" readonly"readonly" ></textarea>
</form>
</body>
</html>
</script>
Gewijzigd op 01/01/1970 01:00:00 door Bram
wordwrap deze php functie kan wat jij wilt.
zie Mag ik ook vragen wáárom je dit wilt? Is het toevallig omdat anders je lay-out eraan gaat wanneer je de data op het scherm zet? In dat geval moet je daar een oplossing voor gaan verzinnen.. ;-)
nee ik moet een tool maken dat wanneer ze een bericht typen ze onder de textarea een live preview zien hoe het gaat worden als ze het bericht versturen.
@Donhertog
De wordwrap van php is inderdaad handig maar hoe zou ik het toe kunnen passen als ik meteen een live preview wil zien in een div of textarea er onder?
Zoiets als hyves dus? Dan geef je je preview div toch gewoon een vaste breedte?
dat zou je eventueel met Ajax kunnen doen. Of zelf een javascript functie maken die niet midden in een woord afbreekt
Ik zit namenlijk aardig vast :-(
Quote:
Waarom ik de wrap functie niet gebruik als ik de standaard wrap functie gebruik dan neemt de hoofdletter H meer ruite inbeslag dan de kleine letter j.
Als je bijvoorbeeld een lettertype als Courier New gebruikt voor de textarea, dan is de j even breed als de H.