JavaScript pro Texy

Značky pro Texy můžete zapisovat ručně, nebo je vkládat přes JavaScript. Tato ukázka je odvozena z https://developer.mozilla.org/…tAreaElement

<style>
.texyBtn{
    cursor: pointer;
    border: 1px solid grey;
    padding: 0.5em 1em;
}
</style>

<script>

function texify(sStartTag, sEndTag) {

    // zde nastavte ID cílového prvku
    var selector = document.getElementById('texy');

    var bDouble = arguments.length > 1, oMsgInput = selector, nSelStart = oMsgInput.selectionStart, nSelEnd = oMsgInput.selectionEnd, sOldText = oMsgInput.value;

    oMsgInput.value = sOldText.substring(0, nSelStart) + (bDouble ? sStartTag + sOldText.substring(nSelStart, nSelEnd) + sEndTag : sStartTag) + sOldText.substring(nSelEnd);

    oMsgInput.setSelectionRange(bDouble || nSelStart === nSelEnd ? nSelStart + sStartTag.length : nSelStart, (bDouble ? nSelEnd : nSelStart) + sStartTag.length);

    oMsgInput.focus();
}

</script>

<p>

<span class="texyBtn" onclick="texify('**','**');">
    </b>B</b>
</span>

<span class="texyBtn" onclick="texify('//','//');">
    <i>I</i>
</span>

<!-- pokud se má značka vložit pouze před text, zadejte jako druhý parametr prázdný řetězec -->
<span class="texyBtn" onclick="texify('^','');">
    <i>x<sup>2</sup></i>
</span>

<span class="texyBtn" onclick="texify('_','');">
    <i>y<sub>2</sub></i>
</span>

<span class="texyBtn" onclick="texify('********','');">
    &lt;hr&gt;
</span>

<!--
    Texy pro zakončení některých značek používá znak \
    Ten musíte vyescapovat jeho zdvojením \\
-->
<span class="texyBtn" onclick="texify('/---div','\\---')">
    &lt;div&gt;
</span>

<!--
    Pokud chcete, můžete do vkládaného kódu přidat i nové řádky
-->
<span class="texyBtn" onclick="texify('\n/---div\n','\n\\---')">
    značka &lt;div&gt; vložená na nové řádky
</span>

</p>

<textarea id="texy" rows="20" cols="100">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Ut facilisis, arcu vitae adipiscing placerat, nisl lectus accumsan nisi, vitae iaculis sem neque vel lectus. Praesent tristique commodo lorem quis fringilla. Sed ac tellus eros. Sed consectetur eleifend felis vitae luctus.
Praesent sagittis, est eget bibendum tincidunt, ligula diam tincidunt augue, a fermentum odio velit eget mi. Phasellus mattis, elit id fringilla semper, orci magna cursus ligula, non venenatis lacus augue sit amet dui.

Pellentesque lacinia odio id nisi pulvinar commodo tempus at odio.

Ut consectetur eros porttitor nunc mollis ultrices.

Aenean porttitor, purus sollicitudin viverra auctor, neque erat blandit sapien, sit amet tincidunt massa mi ac nibh. Proin nibh sem, bibendum ut placerat nec, cursus et lacus. Phasellus vel augue turpis. Nunc eu mauris eu leo blandit mollis interdum eget lorem. </textarea>