I want to make a script to insert emojis into textarea when click. But it never works.
Can anybody point me out where am I doing wrong?
Thank you.
<form>
<button value=""></button>
<button value=""></button>
<button value=""></button>
<br>
<textarea id="text1" cols="40" rows="3" placeholder="This is some dummy text."></textarea>
</form>
<script type="text/javascript ">
let currentInput = document.getElementById('text1');
function insertAtCursor() {
let cursorPos = currentInput.selectionStart;
let v = currentInput.value;
let textBefore = v.substring(0, cursorPos);
let textAfter = v.substring(cursorPos, v.length);
currentInput.value = textBefore + this.value + textAfter;
cursorPos += this.value.length;
currentInput.focus();
currentInput.setSelectionRange(cursorPos, cursorPos);
};
if (document.querySelector('button')) {
document.querySelectorAll('button').forEach((elem, i) => {
elem.addEventListener("click", function(event) {
insertAtCursor();
});
});
}
</script>