[HTML/Javascript] Tabulatoren in einer Textarea ermöglichen? *2 kleine Probleme noch*

[BartTheDevil89]

EDIT: Bin etwas weiter gekommen und daher nochmal neu gestellt.

Hi,

also ich versuchs nochmal mit meinem Script:

<script type="text/javascript">
function DoKeyDown(e) {
	ckey = e.keyCode? e.keyCode: e.which;

	if(e.ctrlKey) ShowKey("    ");
}
function ShowKey(s){ 
	document.formu.template.value += s;
}
</script>

Diese Funktion überprüft bei jeder Eingabe ob die Strg - Taste gedrückt wird und wenn ja, dann werden am Ende der Textarea 4 Leerzeichen eingefügt.
Funktioniert auch soweit alles gut.
Allerdings habe ich hier noch genau 2 Probleme, die ich nicht ganz lösen kann:

1. Es soll nicht nur die Strg - Taste drückt werden, sondern es soll nur ShowKey() aufgerufen werden, wenn Strg + Pfeiltaste nach rechts gedrückt wird. Aber genau das funktioniert nicht. Mein Versuch dafür war:

if(e.ctrlKey && ckey = 39) ShowKey("    ");

Aber da sagt mir der Browser, dass es ein Syntaxfehler wäre. Also wie schaffe ich es, dass ShowKey() nur bei der Kombi aufgerufen wird?

2. Einfügen nicht am Ende, sondern am Leerzeichen:
Derzeit werden die 4 Leerzeichen ja am Ende eingefügt. Aber gibts noch die Möglichkeit dieses Einfügen nicht am Ende oder am Anfang, sondern am aktuellen Leerzeichen einzufügen?

Danke für die Hilfe

 

[paddya]

/* Flexible JavaScript Events by John Resig */
function addEvent( obj, type, fn ) {
  if ( obj.attachEvent ) {
    obj['e'+type+fn] = fn;
    obj[type+fn] = function(){obj['e'+type+fn]( window.event );}
    obj.attachEvent( 'on'+type, obj[type+fn] );
  } else
    obj.addEventListener( type, fn, false );
}
function removeEvent( obj, type, fn ) {
  if ( obj.detachEvent ) {
    obj.detachEvent( 'on'+type, obj[type+fn] );
    obj[type+fn] = null;
  } else
    obj.removeEventListener( type, fn, false );
}

addEvent(document.getElementById('textarea'), 'keyup', checkTab);

Einfach ein Keyup-Event für die Textarea erstellen und die checkTab-Funktion aufrufen.

Greetz

paddya

 

[BartTheDevil89]

Oha...mit javscript hab ichs nicht so. Also wie müsste die jetzt noch eingebaut werden? Bzw. wo wird festgelegt, dass Shift + Tab ein Tab ist. Also komm da grad nicht wirklich mit klar...wäre nett, wenn du noch bisschen was zu erklären könntest.

Danke

 

[paddya]

Die Funktion prüft, was vom User gedrückt wurde beim Eintippen und reagiert entsprechend darauf.

Einbauen ist ganz einfach: Einfach die checkTab-Funktion und meinen Code in eine JavaScript-Datei einfügen und einbinden. Zur Sicherheit würde ich das Tab-Checking aber erst onload hinzufügen.

function checkTab(evt) {
    // ...
}

/* Flexible JavaScript Events by John Resig */
function addEvent( obj, type, fn ) {
  if ( obj.attachEvent ) {
    obj['e'+type+fn] = fn;
    obj[type+fn] = function(){obj['e'+type+fn]( window.event );}
    obj.attachEvent( 'on'+type, obj[type+fn] );
  } else
    obj.addEventListener( type, fn, false );
}
function removeEvent( obj, type, fn ) {
  if ( obj.detachEvent ) {
    obj.detachEvent( 'on'+type, obj[type+fn] );
    obj[type+fn] = null;
  } else
    obj.removeEventListener( type, fn, false );
}

addEvent(document.getElementsByTagName('body')[0], 'load', function() {
    addEvent(document.getElementById('textarea'), 'keyup', checkTab);
});

So in etwa dürfte das gehen. Untested.

Greetz

paddya

 

[BartTheDevil89]

Aber dieses Erkennen und Eintragen von " " an dieser Stelle ist doch schon in der oberen Funtion drin. Also warum sollte es denn jetzt nochmal ne Funktion für geben?

 

[paddya]

Aber dieses Erkennen und Eintragen von " " an dieser Stelle ist doch schon in der oberen Funtion drin. Also warum sollte es denn jetzt nochmal ne Funktion für geben?

Ich verstehe nicht, was du meinst...

Der Code, den ich hinzugefügt habe, macht nichts anderes, als die checkTab-Funktion ausführen zu lassen, wenn der User eine Taste beim Tippen loslässt. Die einzige Änderung, die du machen musst, ist die ID in document.getElementByID() anzupassen (also auch der Textarea eine ID verpassen).

Greetz

paddya

 

[BartTheDevil89]

Hi,

also ich versuchs nochmal mit meinem Script:

<script type="text/javascript">
function DoKeyDown(e) {
	ckey = e.keyCode? e.keyCode: e.which;

	if(e.ctrlKey) ShowKey("    ");
}
function ShowKey(s){ 
	document.formu.template.value += s;
}
</script>

Diese Funktion überprüft bei jeder Eingabe ob die Strg - Taste gedrückt wird und wenn ja, dann werden am Ende der Textarea 4 Leerzeichen eingefügt.
Funktioniert auch soweit alles gut.
Allerdings habe ich hier noch genau 2 Probleme, die ich nicht ganz lösen kann:

1. Es soll nicht nur die Strg - Taste drückt werden, sondern es soll nur ShowKey() aufgerufen werden, wenn Strg + Pfeiltaste nach rechts gedrückt wird. Aber genau das funktioniert nicht. Mein Versuch dafür war:

if(e.ctrlKey && ckey = 39) ShowKey("    ");

Aber da sagt mir der Browser, dass es ein Syntaxfehler wäre. Also wie schaffe ich es, dass ShowKey() nur bei der Kombi aufgerufen wird?

2. Einfügen nicht am Ende, sondern am Leerzeichen:
Derzeit werden die 4 Leerzeichen ja am Ende eingefügt. Aber gibts noch die Möglichkeit dieses Einfügen nicht am Ende oder am Anfang, sondern am aktuellen Leerzeichen einzufügen?

Danke für die Hilfe

 

[paddya]

Gibt es einen Grund, warum du das offensichtlich funktionierende Script, das du hier schon gepostet hattest und das alle möglichen Interaktionsformen mit der Textarea schon implementiert hatte, nicht verwenden willst?

Um den Text an der Cursor-Position einzufügen, solltest du dir mal diesen Artikel durchlesen.

Greetz

paddya

 

[BartTheDevil89]

Hab es jetzt gelöst, danke...