Eingabe nur Am Ende nicht am Curser angehängt?


g.sandra.1995

Grünschnabel
Guten Tag



ich bin absolut Anfängerin mit den Javascript. Durch Internet Recherche habe ich ein klein Projekt für MathML-Editor gebastelt. Allerdings wird meine Eingabe immer am Ende angehängt. Ich hätte es aber gerne an der Curser-Position. Kann jemand helfen? Hier sind meine Quellcodes





mFg

Sandra









++++++++++

ArabicMathML4.css



/* Style the tab */
.tab {
overflow: hidden;
border: 1px solid #ccc;
background-color: #f1f1f1;
}

/* Style the buttons that are used to open the tab content */
.tab button {
background-color: inherit;
float: left;
border: none;
outline: none;
cursor: pointer;
padding: 14px 16px;
transition: 0.3s;
}

/* Change background color of buttons on hover */
.tab button:hover {
background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
background-color: #ccc;
}

/* Style the tab content */
.tabcontent {
display: none;
padding: 6px 12px;
border: 1px solid #ccc;
border-top: none;
}













+++++++++



ArabicMathML4.js



function openCity(evt, cityName) {
// Declare all variables
var i, tabcontent, tablinks;

// Get all elements with class="tabcontent" and hide them
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent.style.display = "none";
}

// Get all elements with class="tablinks" and remove the class "active"
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks.className = tablinks.className.replace(" active", "");
}

// Show the current tab, and add an "active" class to the button that opened the tab
document.getElementById(cityName).style.display = "block";
evt.currentTarget.className += " active";
}

+++++++++



ArabicMathML4.html








<html lang="en" dir="ltr">
<head>
<link rel="stylesheet" href="ArabicMathML4.css" type="text/css"/>
<script type="text/javascript" src="ArabicMathML4.js"></script>
<title>
MathML Arabic
</title>
</head>
<body bgcolor= "# 000000" text= "gold">
<!-- Tab links -->

<form name="arabicMathML" >
<textarea id="ans" name="ans" rows="17" cols="172" class="keyboardInput">
</textarea>
<br>
</form>
<div class="tab">
<button class="tablinks" onclick="openCity(event, 'MathML')">MathML</button>
<button class="tablinks" onclick="openCity(event, 'Latin')">Latin</button>
<button class="tablinks" onclick="openCity(event, 'Operator')">Operator</button>
<button class="tablinks" onclick="openCity(event, 'Miscellaneous')">Miscellaneous</button>
</div>



<div id="MathML" class="tabcontent">



<form name="arabicMathML02" >
<input type="button" value="mi" onClick="document.arabicMathML.ans.value+='&lt;mi&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mi&gt;\n'">

<input type="button" value="mo" onClick="document.arabicMathML.ans.value+='&lt;mo&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mo&gt;\n'">

<input type="button" value="mn" onClick="document.arabicMathML.ans.value+='&lt;mn&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mn&gt;\n'">

<input type="button" value="ms" onClick="document.arabicMathML.ans.value+='&lt;ms&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/ms&gt;\n'">

<input type="button" value="mtext" onClick="document.arabicMathML.ans.value+='&lt;mtext&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mtext&gt;\n'">

<input type="button" value="mfrac" onClick="document.arabicMathML.ans.value+='&lt;mfrac&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mfrac&gt;\n'">

<input type="button" value="binom" onClick="document.arabicMathML.ans.value+='&lt;mfrac linethickness=&quot;0&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mfrac&gt;\n'">

<input type="button" value="bevelled" onClick="document.arabicMathML.ans.value+='&lt;mfrac bevelled=&quot;true&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mfrac&gt;\n'">

<input type="button" value="msub" onClick="document.arabicMathML.ans.value+='&lt;msub&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/msub&gt;\n'">

<input type="button" value="msup" onClick="document.arabicMathML.ans.value+='&lt;msup&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/msup&gt;\n'">

<input type="button" value="msubsup" onClick="document.arabicMathML.ans.value+='&lt;msubsup&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/msubsup&gt;\n'">

<input type="button" value="mrow" onClick="document.arabicMathML.ans.value+='&lt;mrow&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mrow&gt;\n'">

<input type="button" value="msqrt" onClick="document.arabicMathML.ans.value+='&lt;msqrt&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/msqrt&gt;\n'">

<input type="button" value="mroot" onClick="document.arabicMathML.ans.value+='&lt;mroot&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mroot&gt;\n'">

<input type="button" value="mspace" onClick="document.arabicMathML.ans.value+='&lt;mspace&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mspace&gt;\n'">

<input type="button" value="mstyle" onClick="document.arabicMathML.ans.value+='&lt;mstyle&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mstyle&gt;\n'">

<input type="button" value="merror" onClick="document.arabicMathML.ans.value+='&lt;merror&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/merror&gt;\n'">

<input type="button" value="mpadded" onClick="document.arabicMathML.ans.value+='&lt;mpadded&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mpadded&gt;\n'">

<input type="button" value="mphantom" onClick="document.arabicMathML.ans.value+='&lt;mphantom&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mphantom&gt;\n'">

<input type="button" value="mfenced" onClick="document.arabicMathML.ans.value+='&lt;mfenced&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mfenced&gt;\n'">

<input type="button" value="mstack" onClick="document.arabicMathML.ans.value+='&lt;mstack&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mstack&gt;\n'">

<input type="button" value="mtable" onClick="document.arabicMathML.ans.value+='&lt;mtable&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mtable&gt;\n'">

<input type="button" value="mover" onClick="document.arabicMathML.ans.value+='&lt;mover&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mover&gt;\n'">

<input type="button" value="munder" onClick="document.arabicMathML.ans.value+='&lt;munder&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/munder&gt;\n'">

<input type="button" value="munderover" onClick="document.arabicMathML.ans.value+='&lt;munderover&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/munderover&gt;\n'">

<input type="button" value="mmultiscripts" onClick="document.arabicMathML.ans.value+='&lt;mmultiscripts&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/mmultiscripts&gt;\n'">

<input type="button" value="madruwb" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;madruwb&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="longdiv" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;longdiv&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="actuarial" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;actuarial&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="box" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;box&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="roundedbox" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;roundedbox&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="circle" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;circle&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="left" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;left&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="right" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;right&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="top" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;top&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="bottom" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;bottom&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="updiagonalstrike" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;updiagonalstrike&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="downdiagonalstrike" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;downdiagonalstrike&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="verticalstrike" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;verticalstrike&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="horizontalstrike" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;horizontalstrike&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="nested circle" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;nested circle&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="cross out" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;cross out&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="nested roundedbox" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;nested roundedbox&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="all sides and all strikes" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;all sides and all strikes&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="updiagonalarrow" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;updiagonalarrow&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="madruwb" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;madruwb&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">

<input type="button" value="phasorangle" onClick="document.arabicMathML.ans.value+='&lt;menclose notation = &quot;phasorangle&quot;&gt;&nbsp;\n&nbsp;\n&nbsp;\n&lt;/menclose&gt;\n'">
</form>
</div>

<div id="Latin" class="tabcontent">


<form name="arabicMathML03" >


<input type="button" value="&Alpha;" onClick="document.arabicMathML.ans.value+='&amp;Alpha;'">

<input type="button" value="&Beta;" onClick="document.arabicMathML.ans.value+='&amp;Beta;'">

<input type="button" value="&Gamma;" onClick="document.arabicMathML.ans.value+='&amp;Gamma;'">




</form>
</div>




</body>
</html>









+++++++++
 

Sempervivum

Erfahrenes Mitglied
Hier wird beschrieben, wie man Text an der Cursorposition einfügt:

Beim nächsten Mal benutze besser Codetags: In der Werkzeugleiste oben die drei Punkte in der Mitte und dann das </>. Sonst wird das [i] verschluckt, weil es als BBCode für "italic" interpetiert wird.
 

Neue Beiträge