BBcode an Cursorposition einfügen
inspiron
- javascript
0 suit0 inspiron0 Patrick Andrieu
Hallo,
anbei ein Code mit dem ich gern BBCode in 5 Textarea's (in der sich der Cursor befindet) einfügen möchte.
Leider funktioniert es nur mit einer Textarea und zwar nur mit der letzten "eintrag5"
Kann mir bitte jemand unter die Arme helfen!
Danke
<script language="JavaScript">
<!--
function link(aTag, eTag) {
var link = prompt("<?=$lang['enter_link'] ?>","http://");
if(link != "" && link != null && link != "http://"){
var aTag = "[link]" + link + "(" + link + ")";
insert(aTag, eTag);
}
}
function insert(aTag, eTag) {
// Name des Formulars und des Elements
var input = document.forms['write'].elements['eintrag1'];
var input = document.forms['write'].elements['eintrag2'];
var input = document.forms['write'].elements['eintrag3'];
var input = document.forms['write'].elements['eintrag4'];
var input = document.forms['write'].elements['eintrag5'];
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("<?=$lang['enter_format_text']?>");
input.value = input.value.substr(0, pos) + aTag + insText + eTag + input.value.substr(pos);
}
}
-->
<table>
<tr>
<td class="TStab1">
<div align="right">
<a href="Javascript:insert('[h1]', '[/h1]');"><img src="images/h1.gif" height="26" width="26" border="0" alt="<?=$lang['h1']?>"></a>
<a href="Javascript:insert('[b]', '[/b]');"><img src="images/bold.gif" height="26" width="26" border="0" alt="<?=$lang['bold']?>"></a>
<a href="Javascript:insert('[i]', '[/i]');"><img src="images/kursiv.gif" height="26" width="26" border="0" alt="<?=$lang['italic']?>"></a>
</div>
</td>
</tr>
</table>
<textarea name="eintrag1" class="TSinput" rows="6" cols="100%">Text o.k.<?=$eintrag1?></textarea>
<textarea name="eintrag1" class="TSinput" rows="6" cols="100%">Text o.k.<?=$eintrag2?></textarea>
<textarea name="eintrag1" class="TSinput" rows="6" cols="100%">Text o.k.<?=$eintrag3?></textarea>
<textarea name="eintrag1" class="TSinput" rows="6" cols="100%">Text o.k.<?=$eintrag4?></textarea>
<textarea name="eintrag5" class="TSinput" rows="6" cols="100%">Text o.k.<?=$eintrag1?></textarea>
</script>
»» anbei ein Code mit dem ich gern BBCode in 5 Textarea's (in der sich der Cursor befindet) einfügen möchte.
Einerseits möchtest du dir ggf. das hier ansehen - andererseits könnte dich das hier interessieren.
Hallo,
danke für die schnelle Antwort!
Wie bereits geschrieben funktioniert es ja nur mit der letzten "textarea".
Ich möchte das aber auch mit den anderen 4 Textarea's nutzen!
Hallo inspiron!
Ich möchte das aber auch mit den anderen 4 Textarea's nutzen!
var input = document.forms['write'].elements['eintrag1'];
var input = document.forms['write'].elements['eintrag2'];
var input = document.forms['write'].elements['eintrag3'];
var input = document.forms['write'].elements['eintrag4'];
var input = document.forms['write'].elements['eintrag5'];
Der letzte gewinnt! Na, klingelt's? Welchen Wert hat wohl »input«, nach dem Einlesen?
Perl ist toller (<- für Struppi): Es würde melden: »"my" variable $input masks earlier declaration in same scope at - line - «
Eine Idee wäre:
var input_1 = document.forms['write'].elements['eintrag1'];
var input_2 = document.forms['write'].elements['eintrag2'];
.
.
.
und iterieren. Oder über die HTML-Collection arbeiten (Stichwort: getElementsByTagName('textarea') arbeiten.
Viele Grüße aus Frankfurt/Main,
Patrick
[latex]Mae govannen![/latex]
Eine Idee wäre:
var input_1 = document.forms['write'].elements['eintrag1'];
var input_2 = document.forms['write'].elements['eintrag2'];
Variablennamen mit Zahlen"index" schreien geradezu nach Verwendung eines Arrays.
Cü,
Kai
Hallöchen,
ich weiß einfach nicht was ich jetzt machen soll!
Mario
Hallo inspiron!
ich weiß einfach nicht was ich jetzt machen soll!
Dafür sorgen, dass Du eine Variable nicht vier Mal überschreibst! Was hast Du an meiner oder Kais Antwort nicht verstanden?
Viele Grüße aus Frankfurt/Main,
Patrick
Mhh,
ganz einfach, ich weiß nicht wie das mit den Variablen geht. Ich verstehe es einfach nicht.
Ich habe es mal so angepasst und bin aber wieder vor dem Problem,
es sollen die BBCode Buttons nur einmal vorhanden sein und nicht für jede Textbox einzeln.
<html>
<head>
<title>BBCode in mehrere Textfelder</title>
<script type="text/javascript">
<!--
function insert(textFeld, aTag, eTag) {
var input = document.forms["formular"].elements[textFeld];
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);
}
}
//-->//<body bgcolor="#000000" text="#FFFFFF" link="#999999" vlink="#666666" alink="#666666">
</script>
</head>
<div align="left" class="normal"><br>
<FORM ENCTYPE="multipart/form-data" METHOD="POST" name="formular">
<table width="100%" border="0">
<tr>
<input type="hidden" value="" onClick="insert('textarea1','', '')">
<input type="button" value="Fett" onClick="insert('textarea1','[b]', '[/b]')">
<input type="button" value="Kursiv" onClick="insert('textarea1','[i]', '[/i]')">
<input type="button" value="List" onClick="insert('textarea1','[list]', '[/list]')">
<input type="button" value="Eingerückt" onClick="insert('textarea1','[indent]', '[/indent]')"><br>
<textarea name="textarea1" cols="50" rows="2" id="textarea1">Textarea_1 o.k.</textarea>
</label>
<br><br>
</td>
</tr>
<tr>
<input type="hidden" value="" onClick="insert('textarea2','', '')">
<input type="button" value="Fett" onClick="insert('textarea2','[b]', '[/b]')">
<input type="button" value="Kursiv" onClick="insert('textarea2','[i]', '[/i]')">
<input type="button" value="List" onClick="insert('textarea2','[list]', '[/list]')">
<input type="button" value="Eingerückt" onClick="insert('textarea2','[indent]', '[/indent]')"><br>
<textarea name="textarea2" cols="50" rows="2" id="textarea2">Textarea_2 o.k.</textarea>
</label>
<br><br>
</td>
</tr>
<input type="hidden" value="" onClick="insert('textarea3','', '')">
<input type="button" value="Fett" onClick="insert('textarea3','[b]', '[/b]')">
<input type="button" value="Kursiv" onClick="insert('textarea3','[i]', '[/i]')">
<input type="button" value="List" onClick="insert('textarea3','[list]', '[/list]')">
<input type="button" value="Eingerückt" onClick="insert('textarea3','[indent]', '[/indent]')"><br>
<textarea name="textarea3" cols="50" rows="2" id="textarea3">Textarea_3 o.k.</textarea>
</label>
<br><br>
</td>
</tr>
<tr>
<input type="hidden" value="" onClick="insert('textarea4','', '')">
<input type="button" value="Fett" onClick="insert('textarea4','[b]', '[/b]')">
<input type="button" value="Kursiv" onClick="insert('textarea4','[i]', '[/i]')">
<input type="button" value="List" onClick="insert('textarea4','[list]', '[/list]')">
<input type="button" value="Eingerückt" onClick="insert('textarea4','[indent]', '[/indent]')"><br>
<textarea name="textarea4" cols="50" rows="2" id="textarea4">Textarea_4 o.k.</textarea>
</label>
<br><br>
</td>
</tr>
<tr>
<input type="hidden" value="" onClick="insert('textarea5','', '')">
<input type="button" value="Fett" onClick="insert('textarea5','[b]', '[/b]')">
<input type="button" value="Kursiv" onClick="insert('textarea5','[i]', '[/i]')">
<input type="button" value="List" onClick="insert('textarea5','[list]', '[/list]')">
<input type="button" value="Eingerückt" onClick="insert('textarea5','[indent]', '[/indent]')"><br>
<textarea name="textarea5" cols="50" rows="2" id="textarea5">Textarea_5 o.k.</textarea>
</label>
<br>
</td>
</tr>
<tr>
<tr valign="bottom">
<td height="30"> </td>
<td><input type="submit" name="Submit" value="Eintragen"> <input name="Reset" type="reset" id="Reset" value="Reset"></td>
</tr>
</table>
</form>
<br>
</div>
</body>
</html>