I've been working on adding an emoji function, but I'm facing an issue. Whenever I select an emoji from the dropdown while having text in the textarea and the cursor placed at the beginning of the text, the emoji always gets added to the end like this:
Some text here 😃
Here's the code I'm using:
function insertSmiley(smiley)
{
var currentText = document.getElementById("textarea");
var smileyWithPadding = " " + smiley + " ";
currentText.value += smileyWithPadding;
currentText.focus();
}
I already attempted removing currentText.focus();, but it didn't work. I even tried using jQuery to maintain focus on the textarea, yet the emoji still ends up at the end of the text:
$(window).load(function(){
var lastFocus;
$("#dropdown-emojis").mousedown(function(e) {
return false;
});
});
Is there a way for me to make the emoji appear where the cursor is placed?