Hola quiero agregar texto desde un select a un textarea en la parte donde quedo el cursor, pero solo logro que se inserte al comienzo del textarea y no donde esta el cursor
$(document).ready(function(){
$('#txtAreaPreviewMensaje').focus(function(){
var campo=$('#txtAreaPreviewMensaje').val();
$('#longMensaje').text(campo.length);
});
$('#txtAreaPreviewMensaje').keydown(function(){
var campo=$('#txtAreaPreviewMensaje').val();
$('#longMensaje').text(campo.length);
});
$( '#txtAreaPreviewMensaje' ).keyup(function() {
var campo=$('#txtAreaPreviewMensaje').val();
$('#longMensaje').text(campo.length);
});
$('#selecccionar').change(function(){
var value=$('#selecccionar').val();
if(value===''||value===null){
}else{
var pos = $("#ultimaPosicion").val();
var textoActual = $("#txtAreaPreviewMensaje").val();
var textoInsertar = value;
var position = pos;
var output = [textoActual.slice(0, position), textoInsertar, textoActual.slice(position)].join('');
$("#txtAreaPreviewMensaje").val(output);
$("#txtAreaPreviewMensaje").focus();
}
});
/*function posicion(pos){
$('ultimaPosicion').val(pos);
}*/
$('#txtAreaPreviewMensaje').blur(function(){
var end = $('#txtAreaPreviewMensaje').prop('selectionEnd');
$('ultimaPosicion').val(end);
});
});
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
<select id="selecccionar">
<option value="">selecionar dato...</option>
<option value="Emmanuel">Emmanuel</option>
<option value="Cristina">Cristina</option>
<option value="Alicia">Alicia</option>
<option value="Esjani">Esjani</option>
</select>
<br>
<br>
<textarea id="txtAreaPreviewMensaje" name="mensaje" wrap=physical cols="28" rows="4" ></textarea>
<p id="longMensaje"><p>
<br>
<br>
<input type="hidden" id="ultimaPosicion" value="0">
</body>
</htm>