Ver Mensaje Individual
  #1 (permalink)  
Antiguo 03/11/2017, 03:09
Avatar de ASLAN
ASLAN
 
Fecha de Ingreso: septiembre-2007
Mensajes: 419
Antigüedad: 16 años, 7 meses
Puntos: 2
Pregunta Problema en wysiwyg con javascript

Hola
Desde hace un par de años que utilizo el siguiente código javascript para realizar funciones básicas de reemplazo en un textarea.

Código:
function instag(tag) {
    var input = document.form1.text;
    if (typeof document.selection != 'undefined' && document.selection) {
        var str = document.selection.createRange().text;
        input.focus();
        var sel = document.selection.createRange();
        sel.text = "[" + tag + "]" + str + "[/" + tag + "]";
        sel.select();
        return;
    } else if (typeof input.selectionStart != 'undefined') {
        var start = input.selectionStart;
        var end = input.selectionEnd;
        var insText = input.value.substring(start, end);
        input.value = input.value.substr(0, start) + '[' + tag + ']' + insText + '[/' + tag + ']' + input.value.substr(end);
        input.focus();
        input.setSelectionRange(start + 2 + tag.length + insText.length + 3 + tag.length, start + 2 + tag.length + insText.length + 3 + tag.length);
        return;
    } else {
        input.value += ' [' + tag + ']Reemplace este texto[/' + tag + ']';
        return;
    }
}

function geturl(tag) {
    var input = document.form1.text;
    if (typeof document.selection != 'undefined' && document.selection) {
        var str = document.selection.createRange().text;
        input.focus();
        var sel = document.selection.createRange();
        var my_link = prompt("Ingrese la URL:", "http://");
        sel.text = "[" + tag + "]" + my_link + "[/" + tag + "]";
        sel.select();
        return;
    } else if (typeof input.selectionStart != 'undefined') {
        var start = input.selectionStart;
        var end = input.selectionEnd;
        var my_link = prompt("Ingrese la URL:", "http://");
        var insText = input.value.substring(start, end);
        input.value = input.value.substr(0, start) + '[' + tag + ']' + my_link + '[/' + tag + ']' + input.value.substr(end);
        input.focus();
        input.setSelectionRange(start + 2 + tag.length + insText.length + 3 + tag.length, start + 2 + tag.length + insText.length + 3 + tag.length);
        return;
    } else {
        input.value += ' [' + tag + ']Reemplace este texto[/' + tag + ']';
        return;
    }
}

function inslink() {
    var input = document.form1.text;
    if (typeof document.selection != 'undefined' && document.selection) {
        var str = document.selection.createRange().text;
        input.focus();
        var my_link = prompt("Ingrese la URL:", "http://");
        if (my_link != null) {
            if (str.length == 0) {
                str = my_link;
            }
            var sel = document.selection.createRange();
            sel.text = "" + str + "";
            sel.select();
        }
        return;
    } else if (typeof input.selectionStart != 'undefined') {
        var start = input.selectionStart;
        var end = input.selectionEnd;
        var insText = input.value.substring(start, end);
        var my_link = prompt("Ingrese la URL:", "http://");
        if (my_link != null) {
            if (insText.length == 0) {
                insText = my_link;
            }
            input.value = input.value.substr(0, start) + "" + insText + "" + input.value.substr(end);
            input.focus();
            input.setSelectionRange(start + 11 + my_link.length + insText.length + 4, start + 11 + my_link.length + insText.length + 4);
        }
        return;
    } else {
        var my_link = prompt("Ingresar la URL:", "http://");
        var my_text = prompt("Ingresar el texto del link:", "");
        input.value += " " + my_text + "";
        return;
    }
}
Funciona bastante bien, pero cuando el texto excede el tamaño predeterminado del textarea, es decir, aparece la barra de desplazamiento lateral, al hacer el reemplazo (lo hace correctamente) la vista se va al final del textarea y se pierde de vista el reemplazo, que es justo donde uno está trabajando, lo que resulta muy incómodo.

Me explico, al aparecer scrollbar (mucho texto), el reemplazo lo hace correctamente, incluso deja el cursor donde corresponde, PERO la posición del scrollbar se va al final, perdiendo de vista el cursor.

Alguna idea de cómo resolverlo?

Dejo un página web con una demo operativa
La idea es que agreguen mucho texto, hasta que exceda el límite predeterminado y luego suban y hagan un reemplazo cualquiera, para que vean lo que sucede
http://www.academiaholistica.com/ejemplo.html

Gracias
__________________
Registros Akáshicos

Última edición por ASLAN; 03/11/2017 a las 03:55