Avatar billede little_kim86 Nybegynder
23. januar 2006 - 22:33 Der er 17 kommentarer og
1 løsning

Indsæt smilie i form

Jeg skal bruge noget der kan indsætte nogle tegn i en form når man trykker på et billede.

Det skal være sådan at den indsætter tegnene det der hvor curseren står i tekst feltet. IKKE TIL SIDST.

Det jeg bruger nu, sætter nemlig tegnene til sidst i tekst feltet.

Bruger nu:

function setSmiley(pic) {
  document.opret.besked.value += "" + pic.alt + "";
}

<img style='cursor: pointer;' src='../smilies/smile.gif' alt=":)" onclick="setSmiley(this)">
Avatar billede roenving Novice
24. januar 2006 - 01:39 #1
Prøv med skovenborgs insertText: http://skovenborg.1go.dk/javascript/insertText.php !-)
Avatar billede little_kim86 Nybegynder
24. januar 2006 - 16:21 #2
Det alt sikke godt nok... Men det er sådan at det skal være billeder man skal trykke på og ikke form knapper... Ved ikke hvordan det skal se ud hvis det skal være med billeder...
Avatar billede walden Nybegynder
24. januar 2006 - 16:51 #3
Hej

Her er en kode som jeg selv har brugt (men ikke selv kodet) .... den kan du sikkert selv rette til:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" />
<title>Indsæt smiley</title>
<script type="text/javascript">
function insertTag(frmElm,startTag,endTag) {
      if (typeof frmElm.selectionStart == "number") {
            selectedtext = startTag+frmElm.value.substring(frmElm.selectionStart,frmElm.selectionEnd)+endTag;
            frmElm.value = frmElm.value.substring(0,frmElm.selectionStart)+selectedtext+frmElm.value.substr(frmElm.selectionEnd);
      }
      else if (document.selection) {
              frmElm.focus();
              r = document.selection.createRange();
              r.text = startTag+r.text+endTag;}
      else frmElm.value += startTag+endTag;
  }
</script>
<style type="text/css">
</style>
</head>
<body>


<h2>Eksempel</h2>

<br />
<form>
<textarea name="tekst" cols="30" rows="5">1234567890</textarea>
<input type="button" value=":-)" onclick="insertTag(this.form.tekst,':-',')');" /><br>
</form>

</body>
</html>
Avatar billede little_kim86 Nybegynder
24. januar 2006 - 16:54 #4
Gentager lige mig selv "walden", man skal kunne trykke på et billede. Ved dig trykker man jo bare på en knap...
Avatar billede webstuff Nybegynder
24. januar 2006 - 20:22 #5
skift:
<input type="button" value=":-)" onclick="insertTag(this.form.tekst,':-',')');" />
ud med:
<img src="billede.png" alt=":-)" onclick="insertTag(this.form.tekst,':-',')');" />
??
Avatar billede little_kim86 Nybegynder
24. januar 2006 - 21:52 #6
Nu har jeg prøvet at sætte to ting ind, og ingen af dem virkede...

Første her gik jeg ud fra det der var skrevet på den side du kom med webstuff, det virker ikke:

<img style='cursor: pointer;' src="../smilies/smile.gif" alt=":-)" onmousedown="insertText(this.opret.besked,':-)');" onmouseup="this.opret.besked.focus(); mozPlaceCursor(this.opret.besked);" />

Det andet var den linie du skrev:

<img src="../smilies/sad.gif" alt=":-(" onclick="insertTag(this.opret.besked,':-','(');" />

Kan du se hva jeg gør forkert? Har sat det anden på siden ind i en <script type="text/javascript">...
Avatar billede roenving Novice
25. januar 2006 - 07:31 #7
-- andre end form-elementer kan ikke få fat i formen direkte, så der må man få fat i elementet på andre leder, enten via forms-arrayet (hvilket ikke er bestemt fremadkompatibelt, da det glider ud, når de næste generationer af standarder bliver implementeret !-) eller ved at give elementet et id, så det bliver sådan:

<form>
<textarea name="tekst" id="tekst" cols="30" rows="5">1234567890</textarea>
<img src="smiley1.gif" onclick="insertTag(document.getElementById('tekst'),':-',')');">
</form>
Avatar billede little_kim86 Nybegynder
25. januar 2006 - 07:56 #8
Det du skriver der roenving virker heller ikke...Har du taget det ud fra den artikel for, det jeg har af scripts er taget fra den artikel.

Har skrevet:
<TEXTAREA NAME="besked" rows="14" id="tekst" cols="53" onfocus="storeCaretPos(this);" onclick="storeCaretPos(this)" onkeyup="storeCaretPos(this);" style="border:1px solid #63968C; font-family: Verdana; color: #000000; font-size: 8pt"><?php echo "$nyhed"; ?></TEXTAREA>

<img src="../smilies/sad.gif" alt=":-(" onclick="insertTag(this.opret.besked,':-','(');" />


Er det ikke rigtigt nok?
Avatar billede roenving Novice
25. januar 2006 - 08:02 #9
Bemærk at jeg adresserer feltet anderledes:

<img src="smiley1.gif" onclick="insertTag(document.getElementById('tekst'),':-',')');">
Avatar billede little_kim86 Nybegynder
25. januar 2006 - 09:35 #10
Er ikke helt med, kan godt se der er noget jeg har skrevet som du ikke har skrevet...

Men kan du ikke komme med en linie med et billede og når man trykker på det billede sætter den nogle tegn inde. Og den linie skal været lavet ud fra artiklen på http://skovenborg.1go.dk/javascript/insertText.php
Avatar billede roenving Novice
25. januar 2006 - 09:41 #11
<form>
<textarea name="felt" cols="30" rows="5" onfocus="storeCaretPos(this);" onmouseup="storeCaretPos(this)" onkeyup="storeCaretPos(this);" onblur="cursorpos = null">
<img src="smiley1.gif" onclick="insertText(document.getElementById('tekst'),':-')">
</form>
Avatar billede little_kim86 Nybegynder
25. januar 2006 - 10:00 #12
Det virker ikke det du har skrevet renving, det indsætter bare tegnene til sidst i tekst feltet...

<img style='cursor: pointer;' src="../smilies/mad.gif" onclick="insertText(document.getElementById('tekst'),':mad:')">


<TEXTAREA NAME="besked" rows="14" id="tekst" cols="53" onfocus="storeCaretPos(this);" onmouseup="storeCaretPos(this)" onkeyup="storeCaretPos(this);" onblur="cursorpos = null" style="border:1px solid #63968C; font-family: Verdana; color: #000000; font-size: 8pt"><?php echo "$nyhed"; ?></TEXTAREA>
Avatar billede little_kim86 Nybegynder
01. februar 2006 - 09:58 #13
Har fundet frem til lidt her, men det virker bare ikke.
Koden kommer her:

Sidder i head:

<script type="text/javascript">

var cursorpos;
/**
* Inserts text in a form-element
* @param frmElm A form-element, for instance a textarea
* @param text A string with the text which should be inserted
*/
function insertText(frmElm,text,fokus) {
    if (cursorpos && typeof cursorpos.start == "number") { // For Mozilla     
      frmElm.value = frmElm.value.substring(0,cursorpos.start)+text+frmElm.value.substring(cursorpos.end);
      if (fokus) {
        frmElm.setSelectionRange(cursorpos.end+text.length,cursorpos.end+text.length);
        frmElm.focus();       
      }
    }
    else if (cursorpos && cursorpos.range) { // For IE
      r = cursorpos.range;
      r.text = text;
      if (fokus) {frmElm.focus();}
    }
    else { // For everyone else
        frmElm.value += text;
        if (fokus) {frmElm.focus();}
    }
}

function storeCaretPos(frmElm) {
    if (typeof frmElm.selectionEnd == "number") {
        cursorpos = {start:frmElm.selectionStart,end:frmElm.selectionEnd}
    }
    else if (document.selection) {
        cursorpos = {range:document.selection.createRange().duplicate()}
    }
    else;
}

</script>


Knappen:

<input type="button" value=":-)" onmousedown="insertText(this.opret.besked,':-)',true);" onmouseup="this.opret.besked.focus();mozPlaceCursor(this.opret.besked);" />


Textarea:

<TEXTAREA NAME="besked" rows="14" cols="53" onfocus="storeCaretPos(this);" onclick="storeCaretPos(this)" onkeyup="storeCaretPos(this);" style="border:1px solid #63968C; font-family: Verdana; color: #000000; font-size: 8pt"><?php echo "$nyhed"; ?></TEXTAREA>


Håber nogle kan se hva der ikke helt hænger sammen?
Avatar billede roenving Novice
01. februar 2006 - 13:01 #14
-- i hvert fald skal du have en form rundt om form-elementerne, og du skal rundt om det element: this.form.besked !-)
Avatar billede walden Nybegynder
03. februar 2006 - 21:57 #15
Jeg prøver lige igen:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" />
<title>Indsæt smiley</title>
<script type="text/javascript">
function insertTag(frmElm,startTag,endTag) {
      if (typeof frmElm.selectionStart == "number") {
            selectedtext = startTag+frmElm.value.substring(frmElm.selectionStart,frmElm.selectionEnd)+endTag;
            frmElm.value = frmElm.value.substring(0,frmElm.selectionStart)+selectedtext+frmElm.value.substr(frmElm.selectionEnd);
      }
      else if (document.selection) {
              frmElm.focus();
              r = document.selection.createRange();
              r.text = startTag+r.text+endTag;}
      else frmElm.value += startTag+endTag;
  }
</script>
<style type="text/css">
</style>
</head>
<body>


<h2>Eksempel</h2>

<br />
<form>
<textarea name="tekst" cols="30" rows="5">1234567890</textarea>
<input type="image" src="http://www.echoecho.com/i/rainbow.gif" name="image" width="60" height="60"  onclick="insertTag(this.form.tekst,':-)','');return false" />&nbsp;
<input type="image" src="http://www.echoecho.com/i/rainbow.gif" name="image" width="60" height="60"  onclick="insertTag(this.form.tekst,':-(','');return false" /><br>

</form>

</body>
</html>
Avatar billede little_kim86 Nybegynder
03. februar 2006 - 22:30 #16
Det er der skam også roenving... Ved godt hvordan man laver en form og sådan... Men den sætter bare ikke noget ind når jeg har det der... Har <form> og </form> osv... Kan du ikke se nogen fejl?
Avatar billede little_kim86 Nybegynder
05. februar 2006 - 21:42 #17
lukker
Avatar billede little_kim86 Nybegynder
05. februar 2006 - 21:42 #18
Lukker
Avatar billede 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.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

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

IT-JOB