Problemas con bbcode en textarea Antes de nada, decir que tengo conocimientos bastantes limitados de javascript. Por eso he buscado por FDW y por Google algún script ya hecho para usar en un textarea de forma que sea mas fácil para el usuario usar bbcode (como lo hace FDW, pero no el editor visual, el "normal").
Entonces, encontré en este mensaje, este código (lo pongo a continuación):
Código:
Tengo dos problemas con el código, una es que por alguna razón extraña no logro que funcione en IE (aunque sé que puede funcionar en IE, eso seguro), ya que me da este error:function init(){
incluidos=init.arguments;
for(i=0;i<incluidos.length;i++){
cuerpo=document.body.innerHTML;
html="<table><tr><td valign=\"top\"> <img src=\"bbcode/buttons/bold.gif\" width=\"21\" height=\"20\" onclick=\"instag('b','"+incluidos[i]+"')\" onmouseover=\"this.style.border='solid 1px #000000';\" onMouseOut=\"this.style.border='solid 1px #F7F7F7';\" style=\"border:solid 1px #F7F7F7;\" title=\"Negrita\"> <img src=\"bbcode/buttons/underline.gif\" width=\"21\" height=\"20\" onclick=\"instag('u','"+incluidos[i]+"')\" onmouseover=\"this.style.border='solid 1px #000000';\" onmouseout=\"this.style.border='solid 1px #F7F7F7';\" style=\"border:solid 1px #F7F7F7;\" title=\"Subrayado\"> <img src=\"bbcode/buttons/italic.gif\" width=\"21\" height=\"20\" onclick=\"instag('i','"+incluidos[i]+"')\" onmouseover=\"this.style.border='solid 1px #000000';\" onmouseout=\"this.style.border='solid 1px #F7F7F7';\" style=\"border:solid 1px #F7F7F7;\" title=\"Cursiva\"> <img src=\"bbcode/buttons/link.gif\" width=\"21\" height=\"20\" onclick=\"inslink('"+incluidos[i]+"')\" onmouseover=\"this.style.border='solid 1px #000000';\" onmouseout=\"this.style.border='solid 1px #F7F7F7';\" style=\"border:solid 1px #F7F7F7;\" title=\"Insertar enlace\"> <img src=\"bbcode/buttons/insertimage.gif\" width=\"21\" height=\"20\" onclick=\"captura_imag('"+incluidos[i]+"')\" onmouseover=\"this.style.border='solid 1px #000000';\" onmouseout=\"this.style.border='solid 1px #F7F7F7';\" style=\"border:solid 1px #F7F7F7;\" title=\"Insertar imagen\"> <img src=\"bbcode/buttons/smile.gif\" width=\"21\" height=\"20\" onclick=\"ventana_emot('"+incluidos[i]+"')\" onmouseover=\"this.style.border='solid 1px #000000';\" onmouseout=\"this.style.border='solid 1px #F7F7F7';\" style=\"border:solid 1px #F7F7F7;\" title=\"Insertar emoticon\"> <img src=\"bbcode/buttons/code.gif\" width=\"21\" height=\"20\" onclick=\"instag('code','"+incluidos[i]+"')\" onmouseover=\"this.style.border='solid 1px #000000';\" onmouseout=\"this.style.border='solid 1px #F7F7F7';\" style=\"border:solid 1px #F7F7F7;\" title=\"Código\"> <img src=\"bbcode/buttons/quote.gif\" width=\"21\" height=\"20\" onclick=\"instag('quote','"+incluidos[i]+"')\" onmouseover=\"this.style.border='solid 1px #000000';\" onmouseout=\"this.style.border='solid 1px #F7F7F7';\" style=\"border:solid 1px #F7F7F7;\" title=\"Citar\"> <img src=\"bbcode/buttons/bullist.gif\" width=\"20\" height=\"20\" onclick=\"ins_imag('•','"+incluidos[i]+"')\" onmouseover=\"this.style.border='solid 1px #000000';\" onmouseout=\"this.style.border='solid 1px #F7F7F7';\" style=\"border:solid 1px #F7F7F7;\" title=\"Viñeta\" /></td><td valign=\"top\"><table border=\"0\" cellspacing=\"0\" cellpadding=\"0\"><tr><td><img src=\"bbcode/buttons/resize_0.gif\" width=\"21\" height=\"9\" onclick=\"quitar('"+incluidos[i]+"')\" onmouseover=\"this.style.border='solid 1px #000000';\" onmouseout=\"this.style.border='solid 1px #F7F7F7';\" style=\"border:solid 1px #F7F7F7;\" title=\"Disminuir tamaño\"></td></tr><tr><td><img src=\"bbcode/buttons/resize_1.gif\" width=\"21\" height=\"9\" id=\"quita\" onclick=\"agregar('"+incluidos[i]+"')\" onmouseover=\"this.style.border='solid 1px #000000';\" onmouseout=\"this.style.border='solid 1px #F7F7F7';\" style=\"border:solid 1px #F7F7F7;\" title=\"Aumentar tamaño\"></td></tr></table></td></tr></table><textarea name=\""+incluidos[i]+"\" cols=\"45\" rows=\"5\" id=\""+incluidos[i]+"\">";
pat="<textarea+[^>]*"+incluidos[i]+"+[^<]+";
patron =new RegExp(pat,"gi");
coincidencias=new Array();
coincidencias=cuerpo.match(patron);
for(j=0;j<coincidencias.length;j++){
result=new Array();
result=coincidencias[j].match(/\s+id=[^>\s]+/g);
result[0]=result[0].split('"').join('');
result[0]=result[0].split('id=').join('');
result[0]=result[0].split(' ').join('');
if(result[0]==incluidos[i])cuerpo2=cuerpo.split(coincidencias[j]);
}
document.body.innerHTML=cuerpo2[0]+html+cuerpo2[1];
}
}
function instag(tag,campo){
var input = document.getElementById(campo);
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 inslink(campo){
var input = document.getElementById(campo);
if(typeof document.selection != 'undefined' && document.selection) {
var str = document.selection.createRange().text;
input.focus();
var my_link = prompt("Enter URL:","http://");
if (my_link != null) {
if(str.length==0){
str=my_link;
}
var sel = document.selection.createRange();
sel.text = "[a href=\"" + my_link + "\"]" + str + "[/a]";
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("Enter URL:","http://");
if (my_link != null) {
if(insText.length==0){
insText=my_link;
}
input.value = input.value.substr(0, start) +"[a href=\"" + my_link +"\"]" + insText + "[/a]"+ 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 URL:","http://");
var my_text = prompt("Ingresar el texto del link:","");
input.value+=" [a href=\"" + my_link + "\"]" + my_text + "[/a]";
return;
}
}
var reng=5;
function agregar(area){
document.getElementById('quita').disabled=false;
reng=reng+5;
document.getElementById(area).rows=reng;
}
function quitar(area){
reng=reng-5;
if(reng<6){reng=5;
}
document.getElementById(area).rows=reng;
}
function ventana_emot(area){
coordx=screen.width?(screen.width-300)/2:0;
coordy=screen.height?(screen.height-150)/2:0;
window.open("bbcode/emoticons/emoticons.html?campo="+area,"EMOTICONS","width=300,height=150,menubar=no,resizable=yes,left="+coordx+",top="+coordy);
}
function ins_imag(emot,area){
var input = document.getElementById(area);
if(typeof document.selection != 'undefined' && document.selection) {
var str =document.selection.createRange().text;
input.focus();
var sel =document.selection.createRange();
sel.text = str + emot;
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) + insText+ emot + input.value.substr(end);
input.focus();
input.setSelectionRange(end+emot.length,end+emot.length);
return;
}
else{
input.value+=emot;
return;
}
}
function captura_imag(area){
var my_link = prompt("Ingresar URL:","http://");
if (my_link != null) {
ins_imag('[img src=\"'+my_link+'\"]',area);
}
}
Linea: 5
Car.: 3
Error: El objeto no acepta esta propiedad o método
Codigo: 0
URL: ....
Este error, que he buscado por Internet, lo he intentado solucionar (en FDW, me parece que en un mensaje de Tunait, decía que pudiera ser que fueran dos funciones que se llamaran igual, en un foro inglés, no recuerdo la posibilidad que daban a este error, pero recuerdo haberlo intentado también) pero sin éxito.
Otro error, o mas bien, la forma en que funciona este código me crea un problema.
Me parece, que el código crea un textarea (no estoy seguro) y reemplaza al otro, entonces, si yo hago esto:
Código HTML:
<textarea...>Hola mundo</textarea>
Los dos errores o problemas que tengo, son igual de graves, así que ahora mismo es casi mejor no usar este bbcode, pero me gustaría poder solucionarlo ya que es una gran ventaja para el usuario.
Tal vez sea demasaido complejo intentar arreglar esto y es mas sencillo usar otro código, en ese caso, si alguien sabe de alguno (que no sea visual, y tenga, aparte de negrita, itálica y subrayado, url e img) y me pudiera facilitar la URL o el código, también se lo agradecería.
Muchas gracias, un saludo y perdón por la parrafada.
