javascript - ejemplos - insertar codigo html con jquery

Insertar etiquetas html alrededor del texto seleccionado en NicEdit

Question

Estoy buscando una manera de insertar etiquetas HTML alrededor del texto marcado en NicEdit, de modo que pueda, por ejemplo, sangrar el texto y hacerlo verde.

Quiero hacer esto insertando etiquetas <pre> alrededor del texto marcado con una clase css de mi elección (que formatea el texto, lo hace verde, etc.).

El código para mi botón se ve de la siguiente manera:

var customButtonOptions = {
buttons : {
''code'' : {name : __(''Mark text as code''),
type : ''nicEditorCodeButton''}} ,
iconFiles : {''code'' : ''../save.gif''}
};
var nicEditorCodeButton = nicEditorButton.extend({
mouseClick : function() {
alert(''The code button has been clicked '');
}
});
nicEditors.registerPlugin(nicPlugin,customButtonOptions);

Actualmente solo tengo una alerta en la función para asegurarme de que funciona, pero necesito ayuda con una función que coloca las etiquetas <pre> alrededor del texto que he marcado actualmente. Entonces no todo el texto en el área de texto.

O al menos una forma de poner el texto marcado en una variable.

Answer 1

Esta solución funciona para mí, para establecer texto marcado como código. Espero que funcione para ti.

if(cmd==''code''){
if(document.getSelection().anchorNode.data)
{
var a = document.getSelection().anchorOffset;
var b = document.getSelection().focusOffset;
var str = document.getSelection().anchorNode.data.substring(a,b);
}
else str = ''insert code'';
var str1 = ''<div class="code">''+str+''</div>'';
function replaceSelectedText(replacementText) {
var sel, range;
if (window.getSelection) {
sel = window.getSelection();
if (sel.rangeCount) {
range = sel.getRangeAt(0);
range.deleteContents();
document.execCommand(''insertHTML'',false,replacementText);
}
}
}
replaceSelectedText(str1);
}