Dan sekarang kita coba buat tombol bbcode pada textarea dengan menggunakan jquery.
Javascript jquerynya seperti pada kode dibawah ini.
function addText(Text,Message){
var obj = document.form.textareabbcode;
// Pilih textarea
obj.focus();
if (document.selection && document.selection.createRange) // Internet Explorer
{
sel = document.selection.createRange();
if (sel.parentElement() == obj) sel.text = Text;
}
else if (typeof(obj) != "undefined") // Firefox
{
var longueur = parseInt(obj.value.length);
var selStart = obj.selectionStart;
var selEnd = obj.selectionEnd;
obj.value = obj.value.substring(0,selStart) + Text + obj.value.substring(selEnd,longueur);
}
else obj.value += Text;
obj.focus();
}
function addTags(Tag,fTag,Message)
{
var obj = document.form.textareabbcode;
// Pilih textarea
obj.focus();
if (document.selection && document.selection.createRange) // Internet Explorer
{
sel = document.selection.createRange();
if (sel.parentElement() == obj) sel.text = Tag + sel.text + fTag;
}
else if (typeof(obj) != "undefined") // Firefox
{
var longueur = parseInt(obj.value.length);
var selStart = obj.selectionStart;
var selEnd = obj.selectionEnd;
obj.value = obj.value.substring(0,selStart) + Tag + obj.value.substring(selStart,selEnd) + fTag + obj.value.substring(selEnd,longueur);
}
else obj.value += Tag + fTag;
obj.focus();
}
<form name="form">
<textarea name="textareabbcode" class="textareabbcode" wrap="VIRTUAL"></textarea><br />
<!-- BB code -->
<a title="Bold" onmousedown="addTags('[B]','[/B]')" class="tombolbbcode"><b>B</b></a>
<a title="Italic" onmousedown="addTags('[I]','[/I]')" class="tombolbbcode"><i>I</i></a>
<a title="Underline" onmousedown="addTags('[U]','[/U]')" class="tombolbbcode"><u>U</u></a>
<a title="Quote" onmousedown="addTags('[QUOTE]','[/QUOTE]')" class="tombolbbcode"><b>QUOTE</b></a>
<a title="Url" onmousedown="addTags('[URL=http://]','[/URL]')" class="tombolbbcode"><b>URL</b></a>
<a title="Image" onmousedown="addTags('[IMG]','[/IMG]')" class="tombolbbcode"><b>IMG</b></a>
</form>
2 comments:
Keren sob... kalau dipasang di area komentar blogger bisa ga ya?
Belum dicoba sih kang, tapi kayaknya bisa javascript bisa pasti, hehehe
Post a Comment