webForumDet fria alternativet

Kunna lägga in text, smiley där markören befinner sig

31 svar · 2 158 visningar · startad av margar-0

margar-0Medlem sedan nov. 200362 inlägg
#1

Jag har en gästbok där jag kan sätta in tex fet stil på ord genom dessa {bold}{/bold}

Problemet är att när jag markerar texten i textaren som ska ha fet stil så lägger sig dessa tecken sist i meddelandet. Jag vill att texten jag markerat se ut så här: {bold}text som ska vara fet{/bold}. Alltså känna av vad som är markerat i texten.

En till sak, om jag vill lägga in en smiley så ska den teckent för den smileyn hamna där markören står och blinkar.

Precis som det funkar här då man lägger in en ny tråd.

Tacksam för hjälp.

LarsGMedlem sedan dec. 200012 464 inlägg
#2

Flyttas från ASP

Peter SMedlem sedan dec. 20025 483 inlägg
#3
<script type="text/javascript">

var cPos,
    fObj,
    ieC = Boolean(document.selection && document.selection.createRange);

function smilie(str){
    if (ieC){
	if (typeof cPos != "undefined"){
	    cPos.text = str;
	} else {
	    fObj.value += str;
	}
    } else if (typeof window.HTMLTextAreaElement != "undefined"){
	fObj.value = fObj.value.substring(0, fObj.selectionStart) + str + fObj.value.substring(fObj.selectionEnd);
    } else {
	fObj.value += str;
    }
}

function sC() {
    cPos = document.selection.createRange().duplicate();
}

window.onload = function() {
    fObj = document.forms["f"].elements["t"];

    if (ieC) {
	fObj.onclick  = function() { sC(); }
	fObj.onkeyup  = function() { sC(); }
	fObj.onselect = function() { sC(); }
    }
}

function makeBold(){
    if (ieC){
	if (typeof cPos != "undefined"){
	    cPos.text = "{bold}" + cPos.text + "{/bold}";
	} else {
	    fObj.value += "{bold}{/bold}";
	}
    } else if (typeof window.HTMLTextAreaElement != "undefined"){
	fObj.value = fObj.value.substring(0, fObj.selectionStart)
	    + "{bold}"
	    + fObj.value.substring(fObj.selectionStart, fObj.selectionEnd)
	    + "{/bold}"
	    + fObj.value.substring(fObj.selectionEnd);
    }
}

</script>

<form name="f">
    <textarea cols="20" rows="5" name="t"></textarea>
    <br>
    <input type="button" value="Make bold" onclick="makeBold(this)">
    <a href="javascript:void(smilie(':)'))" style="font-family:courier; text-decoration:none">:)</a>
</form>
OputresMedlem sedan feb. 2004333 inlägg
#4

Finns det någon enkel variant för mig som har tre knappar med svenska tecknen å ä ö eftersom jag vänder mig till svenskar även utanför Sverige?

Sätter man markören mellan n och g (illustrerat nedan) och trycker på å-knappen vill jag få in ett å där. Funkar det?
n|gon

Peter SMedlem sedan dec. 20025 483 inlägg
#5
<script type="text/javascript">

var cPos,
    fObj,
    ieC = Boolean(document.selection && document.selection.createRange);

function sC() {
    cPos = document.selection.createRange().duplicate();
}

window.onload = function() {
    fObj = document.forms["f"].elements["t"];

    if (ieC) {
	fObj.onclick  = function() { sC(); }
	fObj.onkeyup  = function() { sC(); }
	fObj.onselect = function() { sC(); }
    }
}

function inschar(c){
    if (ieC){
	if (typeof cPos != "undefined"){
	    cPos.text = c;
	} else {
	    fObj.value += c;
	}
    } else if (typeof window.HTMLTextAreaElement != "undefined"){
	fObj.value = fObj.value.substring(0, fObj.selectionStart)
	    + c
	    + fObj.value.substring(fObj.selectionEnd);
    }
}

</script>

<form name="f">
    <textarea cols="20" rows="5" name="t"></textarea>
    <br>
    <input type="button" value="å" onclick="inschar('å')">
    <br>
    <input type="button" value="ä" onclick="inschar('ä')">
    <br>
    <input type="button" value="ö" onclick="inschar('ö')">
</form>
blåjeansMedlem sedan sep. 2005849 inlägg
#6

Testar det här istället då...

Om jag använder den här så skapas ju en <form>, men hur ska jag göra om jag redan har en <form> och den bara ska läggas till i det jag har?
Jag testade att lägga till den här raden

<a href="javascript:void(smilie(':)'))"</a>

i en <td> där min <form>, och det funkade. Dvs, det la sig en smiley där som man ska klicka på.
MEN, det blir ingen smiley i formuläret.

Hur ska jag göra?
Snälla hjälp...

Peter SMedlem sedan dec. 20025 483 inlägg
#7

Hejsan! :)

Uppdatera raden

document.forms["f"].elements["t"];

...enligt

document.forms["[b]namn_på_formulär[/b]"].elements["[b]namn_på_<textarea>[/b]"];
blåjeansMedlem sedan sep. 2005849 inlägg
#8

Tack snälla!! :f
Jag hade missat att ändra elements till rätt, visste inte riktigt vilket som menades där.

Peter SMedlem sedan dec. 20025 483 inlägg
#9

Det var så lite så :bire

Glöm inte att använda ASSS.

blåjeansMedlem sedan sep. 2005849 inlägg
#10

Jo fast jag är inte riktigt klar än... ;) Hur gör jag om jag vill ha smileybilder istället för en vanlig smiley? Går det?

Peter SMedlem sedan dec. 20025 483 inlägg
#11

Först nu upptäckte jag att det ej var du som startade tråden - alltså blir det svårt för dig att använda ASSS ;)

Så här menar du (se fetstilt text)?

<script type="text/javascript">

var cPos,
    fObj,
    ieC = Boolean(document.selection && document.selection.createRange);

function smilie(str) {
    if (ieC) {
	if (typeof cPos != "undefined")
	    cPos.text = str;
	else
	    fObj.value = str;
    }

    else if (typeof window.HTMLTextAreaElement != "undefined")
	fObj.value = fObj.value.substring(0, fObj.selectionStart) + str + fObj.value.substring(fObj.selectionEnd);

    else fObj.value += str;
}

function sC() {
    cPos = document.selection.createRange().duplicate();
}

window.onload = function() {
    fObj = document.forms["vbform"].elements["message"];

    if (ieC) {
	fObj.onclick  = function() { sC(); }
	fObj.onkeyup  = function() { sC(); }
	fObj.onselect = function() { sC(); }
    }
}

</script>

[b]<a href="#" onclick="smilie(':)'); return false;"><img src="smile.png"></a>[/b]

<form name="vbform">
	<textarea cols="20" rows="5" name="message"></textarea>
</form>
blåjeansMedlem sedan sep. 2005849 inlägg
#12

Njae... jag vet inte, det verkar inte vara rätt. Jag vill ju alltså att det ska bli en smileybild i själva inlägget, men nu blir det bara en vanlig sån här: : )
Jag vill ha bild både där man 1) klickar på den för att få den att lägga sig i inlägget, och 2) i själva inlägget sen (när det är postat). Det verkar som att denna raden löser nr 1, men inte 2.

Av någon anledning så visas dock inte bilden (nr1), jag vet inte varför... jag länkar till den men det visas bara som en bruten bildlänk ändå.

Får jag fråga varför du ändrade <a href>-raden till "#" istället för "javascript:void"? Vad blir det för skillnad då?
Och sen undrar jag också vad .png är för format egentligen, jag har .gif just nu, men ska jag ändra det?
Men det får jag fundera mer på imorgon... är för trött nu. :)

Peter SMedlem sedan dec. 20025 483 inlägg
#13

Eftersom du använder en <textarea> är det bara möjligt att infoga text. När formuläret skickats iväg och du tar emot det på serversidan kan du göra om det till en bild. Jämför med hur det fungerar här på wF: du skriver ett inlägg i en <textarea> och kanske lägger till en smiley i form av ' :) '. När du sedan klickar på "Skicka" ersätts sådana förekomster av <img>-taggar. Med ASP kanske det kan se ut så här (förenklat):

regexp.pattern = " &#58;) "

result = regexp.replace([i]inläggstext[/i], "<img src=""smile.gif"">")
response.write result

I praktiken är det ingen skillnad mellan att använda '#' och 'javascript:void(...)' i href-attributet. Anledningen till att '#' användes i det förra inlägget var att jag letade upp ett gammalt (men komplett) exempel.

Jag är ingen expert på bildformat, så du gör bäst i att läsa på om det på egen hand:
http://en.wikipedia.org/wiki/Png
http://en.wikipedia.org/wiki/GIF

blåjeansMedlem sedan sep. 2005849 inlägg
#14

Peter S skrev:

När formuläret skickats iväg och du tar emot det på serversidan kan du göra om det till en bild.

Ja, det var så jag menade... var inte så bra på att förklara bara. :)

Men om jag då ska använda ditt senaste exempel här, hur får jag in det i den övriga koden?
Det är ofta ett stort problem för mig, hehe, jag vet liksom inte var jag ska skriva grejerna.
Men jag är jättetacksam för hjälpen!!!

Peter SMedlem sedan dec. 20025 483 inlägg
#15

Jag skickar med ett exempel som du kan testa dig fram med. Döp om filen till .asp :)

Peter SMedlem sedan dec. 20025 483 inlägg
#16

Jag har uppdaterat filen med JS-koden också ;)

blåjeansMedlem sedan sep. 2005849 inlägg
#17

Tack, jättesnällt!!

Jag fattar bara inte riktigt vart jag ska lägga den här snutten.. Och räcker det att ändra det "t" som är i fetstil, till rätt namn?

<%
dim t
t = request.form("[B]t[/B]") & ""

if len(t) > 0 then
  dim re
  set re = new regexp

  re.global  = true
  re.pattern = " :\) "

  t = re.replace(t, "<img src=""smile.gif"">")
  'om det är fler smilies som skall göras om
  '
  're.pattern = " ;\) "
  't = re.replace(t, "<img src=""filnamn.gif"">")
  'o s v

  response.write "<div style=""padding:5px; border:1px solid #999; background:#eee"">" & t & "</div>"

  set re = nothing
end if
%>

Hoppas du har tålamod med mig... :r

Peter SMedlem sedan dec. 20025 483 inlägg
#18

Lägg den där kodsnutten där du vill att texten från formuläret skall visas.

Det fetstilta är namnet på <textarea>n.

:)

hltmMedlem sedan nov. 2004438 inlägg
#19

En liten sidofråga; om man har flera textareas på samma sida, namngivna enligt mönstret name=pgt_textarea_1, pgt_textarea_2 osv upp t pgt_textarea_n, är det då möjligt att modifiera detta script för detta syfte också?

Den här raden pekar ju ut en specifik textarea:
fObj = document.forms["f"].elements["pgt_textarea_X"];
- Jag vill ju peka på den textarea där markören är/som har fokus?

Peter SMedlem sedan dec. 20025 483 inlägg
#20

Hej! :)

Titta på detta inlägg:
http://www.webforum.nu/showthread.php?p=1114454#post1114454

139 ms totalt · 3 externa anrop · v20260731065814-full.beb2e261
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
136 ms — hämta tråd, inlägg och bilagor (db)