Javascript e PHP - Botão Bold, Italico,Underline, e-mail e Http

Sei o que muitos vão dizer, pq não usar o WYSYS? Resposta simples, pq ele altera todo o padrão CSS ja pré-definido da pagina.

Para tirar o efeito por exemplo <b>laweb</b> vc deve selecionar desde <b até </b> e depois clicar no botão "Tirar Efeito".

Para poder usar o mesmo script em várias paginas eu dividi ele da seguinte maneira:

Script para usar em sua pagina PHP
<?php
$Nome_do_Campo = "agenda";
include_once("biu.php");
?>
<textarea cols="80" rows="10" name="agenda" class="preto" ></textarea>

Arquivo biu.php
<script type="text/javascript">
<!--
function formatText (el,tag) {
var selectedText=document.selection?document.selection.createRange().text:el.value.substring(el.selectionStart,el.selectionEnd);// IE:Moz
if (tag !='e' || tag !='h') var newText='<'+tag+'>'+selectedText+'</'+tag+'>';
if (tag=='e') var newText='<a href="mailto:'+selectedText+'">'+selectedText+'</a>';
if (tag=='h') var newText='<a href="http://'+selectedText+'" target=_blank>'+selectedText+'</a>';
if(document.selection){//IE
document.selection.createRange().text=newText;
}
else{//Moz
el.value=el.value.substring(0,el.selectionStart)+newText+el.value.substring(el.selectionEnd,el.value.length);
}

}

function formatText_tira (el) {
var selectedText=document.selection?document.selection.createRange().text:el.value.substring(el.selectionStart,el.selectionEnd);// IE:Moz
var newText=selectedText;
var oldText=selectedText;
for (i=1;i<=5;i++) { if (i==1) tag='b'; if (i==2) tag='i'; if (i==3) tag='u'; if (i<=3) { var tagX='<'+tag+'>';
var tagY='</'+tag+'>';
newText = newText.replace(tagX,'');
newText = newText.replace(tagY,'');
}
if (i==4) {
var tagJ=newText.split('<',1); if (!tagJ[0]) { var tagX=newText.split('>',2);
var tagY='</a';
newText = newText.replace(newText,tagX[1]);
newText = newText.replace(tagY,'');
}
}
if (i==5) {
var tagJ=newText.split('<',1); if (!tagJ[0]) { var tagX=newText.split('>',2);
var tagY='</a';
newText = newText.replace(newText,tagX[0]);
newText = newText.replace(tagY,'');
}
}
}
if (newText=="undefined") nextText=oldText;
if(document.selection){//IE
document.selection.createRange().text=newText;
}
else{//Moz
el.value=el.value.substring(0,el.selectionStart)+newText+el.value.substring(el.selectionEnd,el.value.length);
}

}
//-->
</script>

<style>
.button {
font-family:Tahoma, Verdana, Arial;
color: #000066;
font-size:12px;
font-weight:bold;
text-align:center;
background: #f5f5f5;
}
.button_tirar {
font-family:Tahoma, Verdana, Arial;
color: #CC0000;
font-size:12px;
font-weight:bold;
text-align:center;
background: #f5f5f5;
}
</style>

<table cellspacing=0 cellpadding=0><tr>
<td><input type="button" value="N" onclick="formatText (<?=$Nome_do_Campo?>,'b');" class=button /></td>
<td><input type="button" value="I" onclick="formatText (<?=$Nome_do_Campo?>,'i');" class=button /></td>
<td><input type="button" value="S" onclick="formatText (<?=$Nome_do_Campo?>,'u');" class=button /></td>
<td><input type="button" value="e-mail" onclick="formatText (<?=$Nome_do_Campo?>,'e');" class=button /></td>
<td><input type="button" value="link" onclick="formatText (<?=$Nome_do_Campo?>,'h');" class=button /></td>
<td><input type="button" value="Tirar Efeito" onclick="formatText_tira (<?=$Nome_do_Campo?>);" class=button_tirar /></td>
</tr></table>