String an Mousefocus plazieren

[Heinz]

Hallo,

wie setze ich einen bestimmten String in genau das HTML-Formularfeld und innerhalb dessen genau an die Stelle, an der die Mouse- oder Cursorposition sich gerade befindet?

Heinz

[Gunther]

Hallo Heinz!

wie setze ich einen bestimmten String in genau das HTML-Formularfeld

Soweit kann ich folgen ...,

und innerhalb dessen genau an die Stelle, an der die Mouse- oder Cursorposition sich gerade befindet?

aber hier nicht mehr. Denn normalerweise wird der Cursor (bei LTR) immer ganz nach links in ein Eingabefeld gesetzt, wenn es den Fokus erhält.

Vielleicht verrätst du uns noch ein bisschen mehr über dein Vorhaben, bspw. woher der String kommt, um was für Felder es sich in deinem Formualr handelt, wieso weshalb warum der String nicht (auch) am Anfang des Eingabefeldes stehen darf/soll etc.?

Gruß Gunther

[ChrisB]

Hi,

wie setze ich einen bestimmten String in genau das HTML-Formularfeld und innerhalb dessen genau an die Stelle, an der die Mouse- oder Cursorposition sich gerade befindet?

Für den Start deiner Recherche: http://aktuell.de.selfhtml.org/artikel/javascript/bbcode/

MfG ChrisB

[Heinz]

Hi ChrisB,

danke für den Link, leider habe ich jetzt 2 Probleme mehr :-)

Der Code ist klasse, er funktioniert auch prima. Aber es basiert (statisch) auf vorhandenen Namen des Formularfeldes (eingabe) Namen des Formulares (formular).

  
var input = document.forms['formular'].elements['eingabe'];  

Wenn es mir jetzt noch gelänge, das zu dynamisieren, also den Elementnamen sowie den Formularnamen anhand der Curserposition auszulesen und dann meinem onclick-Event als Parameter mit zu geben, wäre alles perfekt.

Kann man das überhaupt mit JS?

Grüße, Heinz

[Der Martin]

Hallo,

var input = document.forms['formular'].elements['eingabe'];

Wenn es mir jetzt noch gelänge, das zu dynamisieren, also den Elementnamen sowie den Formularnamen anhand der Curserposition auszulesen und dann meinem onclick-Event als Parameter mit zu geben, wäre alles perfekt.

du brauchst das Element, das geklickt wurde? Das bekommst du am einfachsten, indem du in der Handlerfunktion auf this zugreifst. Da hast du sofort eine Referenz auf das Element.

Ciao,
 Martin

[Heinz]

Hi Martin,

du brauchst das Element, das geklickt wurde? Das bekommst du am einfachsten, indem du in der Handlerfunktion auf this zugreifst. Da hast du sofort eine Referenz auf das Element.

Nein, eigentlich nicht. Denn das wäre der Button oder der Link, auf den geklickt wurde.
Ich würde aber gerne 1 Handlerfunktion auf verschiedene (zumindest) Elemente anwenden und (optimalerweise) sogar auf verschiedenen Elemente in verschiedenen Formularen.

Wenn es mir jetzt noch gelänge, das zu dynamisieren, also den Elementnamen sowie den Formularnamen anhand der Curserposition auszulesen und dann meinem onclick-Event als Parameter mit zu geben, wäre alles perfekt.

Deshalb bräuchte ich, abhängig davon, wo ich mit dem Cursor gerade bin, den Elementnamen und den Formularnamen.

Grüße, Heinz

[ChrisB]

Hi,

Deshalb bräuchte ich, abhängig davon, wo ich mit dem Cursor gerade bin, den Elementnamen und den Formularnamen.

Dann nutze den focus-Event des Formularfeldes, den ohne den kommt der Cursor ja nicht rein ins Feld.

Und vom Feld auf das zugehörige Formular zu schließen, ist dann ja trivial. (Bzw. vermutlich gar nicht mehr nötig.)

MfG ChrisB

[Heinz]

Dann nutze den focus-Event des Formularfeldes, den ohne den kommt der Cursor ja nicht rein ins Feld.

Hi ChrisB,

soweit, so gut. Aber es soll ja nicht immer und auf jeden Fall der Text (String) in das Formularfeld gesetzt wreden, sndern nur dann, wenn der User das möchte.

Dann aber auch ggf. mehrfach.

Sehe ich das falsch, dass der event-handler onfocus da nicht der richtige ist?

Oder meinst Du das anders und ich könnte über den focus-eventhandler den Elementnamen an den onclick-eventhandler weitergeben? Falls ja, wie macht man das?

Grüße, Heinz

[Heinz]

Ich habe jetzt versucht, über den onfocus() Eventhandler eine Variable zu setzen. Diese Variable soll den Elementnamen beinhalten, aus dem der onfocus Eventhandler ausgelöst wird.

Dann will ich den onclick-Eventhandler damit füttern.

Aber ich erhalte einen JS-Fehler:

Fehler: input is undefined
Quelldatei: file:///C:/test/html2.html
Zeile: 16

Aber so weit weg glaube ich von der Lösung gar nicht zu sein, oder?

Heinz

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"  
        "http://www.w3.org/TR/html4/strict.dtd">  
<html>  
<head>  
  <script type="text/javascript">  
  
function var_setz(ename) {  
var elementname = ename;  
return elementname;  
}  
  
  
function insert(aTag, eTag, formularname, elementname) {  
  var input = document.forms[formularname].elements[elementname];  
  input.focus();  
  /* für Internet Explorer */  
  if(typeof document.selection != 'undefined') {  
    /* Einfügen des Formatierungscodes */  
    var range = document.selection.createRange();  
    var insText = range.text;  
    range.text = aTag + insText + eTag;  
    /* Anpassen der Cursorposition */  
    range = document.selection.createRange();  
    if (insText.length == 0) {  
      range.move('character', -eTag.length);  
    } else {  
      range.moveStart('character', aTag.length + insText.length + eTag.length);  
    }  
    range.select();  
  }  
  /* für neuere auf Gecko basierende Browser */  
  else if(typeof input.selectionStart != 'undefined')  
  {  
    /* Einfügen des Formatierungscodes */  
    var start = input.selectionStart;  
    var end = input.selectionEnd;  
    var insText = input.value.substring(start, end);  
    input.value = input.value.substr(0, start) + aTag + insText + eTag + input.value.substr(end);  
    /* Anpassen der Cursorposition */  
    var pos;  
    if (insText.length == 0) {  
      pos = start + aTag.length;  
    } else {  
      pos = start + aTag.length + insText.length + eTag.length;  
    }  
    input.selectionStart = pos;  
    input.selectionEnd = pos;  
  }  
  /* für die übrigen Browser */  
  else  
  {  
    /* Abfrage der Einfügeposition */  
    var pos;  
    var re = new RegExp('^[0-9]{0,3}$');  
    while(!re.test(pos)) {  
      pos = prompt("Einfügen an Position (0.." + input.value.length + "):", "0");  
    }  
    if(pos > input.value.length) {  
      pos = input.value.length;  
    }  
    /* Einfügen des Formatierungscodes */  
    var insText = prompt("Bitte geben Sie den zu formatierenden Text ein:");  
    input.value = input.value.substr(0, pos) + aTag + insText + eTag + input.value.substr(pos);  
  }  
}  
  
  
  </script>  
</head>  
<body>  
  <h1>Demo: Einf&uuml;gen von Inhalten in eine Textarea</h1>  
  <p>Positionieren Sie einfach den Cursor innerhalb der textarea oder markieren Sie Text darin.  
     W&auml;hlen Sie dann "Einf&uuml;gen", um <code>[link]...[/link]</code> an dieser Stelle  
     einf&uuml;gen zu lassen, sofern es der Browser erm&ouml;glicht.</p>  
  <form name="formular" action="">  
    <p><textarea cols="30" rows="10" name="eingabe" onfocus="var_setz('eingabe')">Ihre Nachricht</textarea></p>  
    <p><input type="button" value="Einfügen" onClick="insert('[link]', '[/link]', 'formular', 'elementname')"></p>  
  </form>  
</body>  
</html>  
  

[MudGuard]

Hi,

function var_setz(ename) {
var elementname = ename;
return elementname;
}

Du hast hier eine Variable, die nur innerhalb der Funktion var_setz existiert.

function insert(aTag, eTag, formularname, elementname) {
  var input = document.forms[formularname].elements[elementname];

Und hier versuchst Du, außerhalb der Funktion var_setz auf diese Variable zuzugreifen.

Leg die Variable außerhalb der Funktion an. Setze sie in der Funktion var_setz. Dann kannst Du ihren Wert in der funktion insert benutzen.

cu,
Andreas

[Heinz]

Hi Andreas,

Du hast hier eine Variable, die nur innerhalb der Funktion var_setz existiert.

Ja. Soweit habe ich das auch heute über den Tag hinweg erroiert.
Ich dachte aber, man könnte sie (wie in php) über return ans script zurückschicken?

Und hier versuchst Du, außerhalb der Funktion var_setz auf diese Variable zuzugreifen.

Leg die Variable außerhalb der Funktion an.

Habe ich schon versucht. Aber alles, was ich da gemacht habe, hat auch nicht geklappt.

Setze sie in der Funktion var_setz. Dann kannst Du ihren Wert in der funktion insert benutzen.

Ist das ein Tippfehler gewesen? Meinst Du, ich soll sie außeralb der Funktion var_setz setzen?

Im Hauptscript? Wenn ja, wie? Ich habe alles durchprobiert, was mir einfiel und was ich im Netz so gefunden habe.

Oder in der function insert()?
Aber auch dann weiß ich nicht, wie?

Grüße, Heinz

[Heinz]

Redet denn nun gar keiner mehr mit mir? ;-)
Grüße, Heinz