Avatar billede aaboe Nybegynder
28. september 2006 - 21:40 Der er 6 kommentarer og
1 løsning

Placere markøren i et textarea

Jeg har et textarea i en form, hvori jeg har noget tekst stående.

Jeg har så en knap jeg kan trykke på, for at tilføje dato og tidspunkt i begyndelsen af mit textarea.

Det jeg gerne vil er at sætte fokus på mit textarea (nemt nok) og så herefter stille markøren lige efter det jeg har indsat via min knap.

Med andre ord, hvordan placerer jeg markøren i et textarea?
Avatar billede gider_ikke_mere Nybegynder
29. september 2006 - 04:02 #1
Jeg bruger denne til at indsætte smileys i et textarea:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.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 emoticon(text, formnavn, inputnavn) {
  var frm = document.forms[formnavn];
  var elem = frm.elements[inputnavn];

  text = ' ' + text + ' ';

  if (elem.createTextRange && frm.message.caretPos) {
    var caretPos = elem.caretPos;
    caretPos.text = caretPos.text.charAt(caretPos.text.length - 1) == ' ' ? text + ' ' : text;
    elem.focus();
  } else {
    elem.value  += text;
    elem.focus();
  }
}
</script>
</head>

<body>
<form name="minform" action="#" method="post">
<textarea name="tekst" id="message"></textarea>
<input type="button" name="knap" value="Button" onClick="java script:emoticon(';-)', 'minform', 'tekst')">
</form>
</body>
</html>
Avatar billede gider_ikke_mere Nybegynder
29. september 2006 - 04:17 #2
Hov, der manglede lidt:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.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 emoticon(text, formnavn, inputnavn) {
  var frm = document.forms[formnavn];
  var elem = frm.elements[inputnavn];

  text = ' ' + text + ' ';

  if (elem.createTextRange && frm.message.caretPos) {
    var caretPos = elem.caretPos;
    caretPos.text = caretPos.text.charAt(caretPos.text.length - 1) == ' ' ? text + ' ' : text;
    elem.focus();
  } else {
    elem.value  += text;
    elem.focus();
  }
}
function storeCaret_post(textEl) {
        if (textEl.createTextRange) textEl.caretPos = document.selection.createRange().duplicate();
}
</script>
</head>

<body>
<form name="minform" action="#" method="post">
<textarea name="tekst" id="message" onSelect="storeCaret_post(this);" onClick="storeCaret_post(this);" onKeyUp="storeCaret_post(this);"></textarea>
<input type="button" name="knap" value="Button" onClick="java script:emoticon(';-)', 'minform', 'tekst')">
</form>
</body>
</html>
Avatar billede aaboe Nybegynder
02. december 2006 - 21:19 #3
Ovenstående havde problemer med Mozilla, men fandt nedenstående:

function insertAtCursor(myField, myValue) {
  if (document.selection) { //IE support
    var temp;
    myField.focus();
    sel = document.selection.createRange();
    temp = sel.text.lenght;
    sel.text = myValue;
    if (myValue.length == 0) {
      sel.moveStart('character', myValue.length);
      sel.moveEnd('character', myValue.length);
    } else {
      sel.moveStart('character', -myValue.length + temp);
    }
    sel.select();
  } else if (myField.selectionStart || myField.selectionStart == '0') { //MOZILLA/NETSCAPE support
    var startPos = myField.selectionStart;
    var endPos = myField.selectionEnd;
    myField.value = myField.value.substring(0, startPos) + myValue + myField.value.substring(endPos, myField.value.length);
    myField.selectionStart = startPos + myValue.length;
    myField.selectionEnd = startPos + myValue.length;
  } else {
    myField.value += myValue;
  }
 
  myField.focus();
}

Smid et svar, så jeg kan få lukket spørgsmålet
Avatar billede aaboe Nybegynder
02. december 2006 - 21:24 #4
Ved at benytte nedenstående, kan man flytte cursoren:

if (document.selection) { //IE support
    myField.focus();
    sel = document.selection.createRange();
    sel.moveStart('character', -5);
    sel.moveEnd('character', -5);
    sel.select();
  } else if (myField.selectionStart || myField.selectionStart == '0') { //MOZILLA/NETSCAPE support
    var startPos = myField.selectionStart;
    var endPos = myField.selectionEnd;
    myField.selectionStart = startPos -5;
    myField.selectionEnd = startPos -5;
  }

Jeg flytter her cursoren 5 positioner tilbage.
Avatar billede gider_ikke_mere Nybegynder
12. januar 2007 - 10:19 #5
Behold du selv pointene.
Avatar billede gider_ikke_mere Nybegynder
11. november 2007 - 20:17 #6
Lukketid?
Avatar billede aaboe Nybegynder
12. november 2007 - 09:29 #7
Ups, hermed lukkes :-)
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