Javascript: In einer Textarea markierten Text ändern

Freddixx

<3 my life
ID: 77099
L
7 Mai 2006
1.818
133
Hallo!

Ich überarbeite grade meinen kleinen privaten Newseditor. Eigentlich bin ich kein Fan von Javascript und versuche es so wenig wie nur irgend möglich zu benutzen.

Jetzt bin ich aber dennoch gewillt, mir das anzusehen. Ich will nicht unbedingt ne fertige Lösung, den Ehrgeiz, es selbst herauszufinden, habe ich schon. Allerdings gestaltet sich der Anfang schwer. Wie es aussieht muss ich - um eine hohe Lauffähigkeit zu garantieren - von einer Browserweiche Gebrauch machen. Ist das soweit richtig?

Dann kann ich via: document.getSelection oder auf den markierten Text zugreifen. Aber wie geht's weiter? Einfach:
Code:
text="(b)"+document.getSelection+"(/b)";
document.selection=text;
wird wohl nicht funktionieren. Bitte gebt mir mal Starthilfe. Freu mich auf eure Antworten :)

Gruß, Fred
 
Wie es aussieht muss ich - um eine hohe Lauffähigkeit zu garantieren - von einer Browserweiche Gebrauch machen. Ist das soweit richtig?

jep, als ich das vor 2-3 Jahren mal gemacht habe musste ich, soweit ich mich recht erinner an bestimmten Stellen 4 versionen machen weil die browser das anders lösen:
ie, opera, ff und safari, wobei ich mir bei letztem net mehr sicher bin, oder der wirklich anders reagiert hat als der ff
 
function insert(opentag, closetag)
{
if (window.getSelection)
{
window.getSelection() = opentag + window.getSelection() + closetag;
}
else if (document.getSelection)
{
document.getSelection() = opentag + document.getSelection() + closetag;
}
else if (document.selection)
{
document.selection.createRange().text = opentag + document.selection.createRange().text + closetag;
}
}

so in der art ^^
 
Schaust du hier: https://phpfi.com/119215 Hatte ich vor Jahre mal gebastelt, weil ich ähnliche Probleme hatte. Steht unter LGPL, also frei verwendbar. Zwar würde ich heute einiges anders machen, funktionieren tuts aber drotzdem.

Verwendung ist ganz einfach...

PHP:
var textarea = getTextarea('id_der_textarea');
textarea.selection.add('<b>','</b>',true);

Das Script kann natürlich um einiges mehr. Es vereinheitlicht das komplette Handling mit textselctions...
 
Zuletzt bearbeitet:
Ich will's ja nicht benutzen, sondern selbst programmieren ;) Ich als Javascript-Anti muss es nicht haben, mich interessiert, wie es funktioniert! (Nur für den Fall, dass es mal für einen Kunden umgesetzt werden muss).
 

Da passiert erstmal genau gar nichts :D

Schaust du hier: https://phpfi.com/119215 Hatte ich vor Jahre mal gebastelt, weil ich ähnliche Probleme hatte. Steht unter LGPL, also frei verwendbar. Zwar würde ich heute einiges anders machen, funktionieren tuts aber drotzdem.

Ich habe mir deinen Code angeschaut. Ich überlege, ob es das jetzt bringt mich da rein zu knien, oder ob es eine leichtere Lösung gibt. Hat noch jemand ne Idee?
 
Warum sind plötzlich alle weg :biggrin:

Wie gesagt, ich suche keine fertigen Scripte, sondern will den Ansatz selbst hinkriegen. Das von Hasilein hat nicht funktioniert. Erbitte weitere Inputs ;)
 
wenn du nix fertiges haben willst, ist das von hasilein doch mehr als genug input.
es stehen die befehle drin, womit das geht und zugleich mehrere versionen für verschiedene browser, das noch in google geworfen und man findet dokumentationen zu den befehlen
 
Ach, danke.. ich Idiot.. ich hab das so reingepackt :LOL:

Das sah so fertig aus, dass ich das in meiner Betriebsblindheit einfach übernommen habe. Ich schau mich mal um.
 
Sooooo.. ich haben fertig. So einfach war's dann doch nicht, aber dropsdem danke für eure Hilfe ;)

Code:
function cms_insert(o_tag,c_tag)
{
  //Pfad auf die Textbox legen
  var textbox_pointer = document.getElementById("textbox");
  //Inhalt aus der textbox holen
  var textbox_inhalt = textbox_pointer.value;

  //Firefox
  if (window.getSelection)
  {
    //aus dem Inhalt der Textbox wird der String vom Anfang bis zum Ende der Selektion herausgefischt
    var selektion = textbox_inhalt.substring(textbox_pointer.selectionStart,textbox_pointer.selectionEnd);
  }
  //IE
  else if (document.selection)
  {
    var selektion = document.selection.createRange().text;
  }
  //T3h rest
  else if (document.getSelection)
  {
    var selektion = document.getSelection();
  }

  //Speichert den Teil des Textes vom Anfang BIS zur Selektion
  var textbox_beginn = textbox_inhalt.substring(0,textbox_inhalt.indexOf(selektion));
  //Speichert den Teil ab ENDE der Selektion
  var textbox_ende = textbox_inhalt.substring(textbox_inhalt.indexOf(selektion)+selektion.length,textbox_inhalt.length);
  //Setzt die Tags vor und hinter den selektierten Text
  selektion = o_tag+selektion+c_tag;
  //Generiert den kompletten Inhalt
  textbox_inhalt = textbox_beginn+selektion+textbox_ende;
  //Schiebt es zurück ins Textfeld
  document.getElementById("textbox").value = textbox_inhalt;
}