hi All.
I have taken from internet javascript code that add bb tags to the selected words. but in the documentation of this script it is said that without selecting text it must also add bb tags and when add bb tag at the end of text it automatically closes bb tags.
here is script. but it only wraps code when selecting text.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Building Better BBCode :: HTML</title>
<script type="text/javascript">
//bbcode insertion..
//define tags, to let the script know when a tag is open and needs to be closed
var b = 2;
var i = 2;
var u = 2;
var s = 2;
var q = 2;
var center = 2;
var url = 2;
var img = 2;
var youtube = 2;
//function to insert tags
function tag(v, tagadd, newbut, tagclose, oldbut, name) {
//our text box
var txt = window.document.posting.post;
//ie handles selections differently
if (document.selection) {
//if text is selected, wrap the tags
theSelection = document.selection.createRange().text;
if (theSelection) {
document.selection.createRange().text = tagadd + theSelection + tagclose;
txt.focus();
theSelection = '';
}
else{
//if there are no open tags of this type, open one
if (eval(v)%2 == 0) {
document.getElementById(name).value = newbut;
txt.focus();
sel = document.selection.createRange();
sel.text = tagadd;
} else {
//otherwise, close the tag
document.getElementById(name).value = oldbut;
txt.focus();
sel = document.selection.createRange();
sel.text = tagclose;
}
}
//add to the total number of tags, if the tag just added was an opening tag, the number will be odd and the script will know to close it next time
eval(v+"++;");
}
//firefox time =)
else{
//if text is selected, wrap the tags
if((txt.value).substring(txt.selectionStart, txt.selectionEnd) != ''){
txt.value = (txt.value).substring(0, txt.selectionStart) + tagadd + (txt.value).substring(txt.selectionStart, txt.selectionEnd) + tagclose + (txt.value).substring(txt.selectionEnd, txt.textLength);
return;
}
else{
//if there are no open tags of this type, open one
if (eval(v)%2 == 0) {
document.getElementById(name).value = newbut;
txt.value = (txt.value).substring(0, txt.selectionStart) + tagadd + (txt.value).substring(txt.selectionEnd, txt.textLength);
txt.focus();
//otherwise, close the tag
} else {
document.getElementById(name).value = oldbut;
txt.value = (txt.value).substring(0, txt.selectionStart) + tagclose + (txt.value).substring(txt.selectionEnd, txt.textLength);
txt.focus();
}
//same as with ie
eval(v+"++;");
}
}
}
//handles font size and color
function font(bbopen, bbclose) {
var txt = window.document.posting.post;
//simply add it on to the end of the form
txt.value += bbopen + bbclose;
txt.focus();
return;
}
//a little help text line underneath the bbcode buttons detailing their syntax, et cetera. (phpbb style)
function helpline(help) {
var helpbox = document.getElementById('helpbox');
helpbox.value = eval(help + "_help");
}
</script>
</head>
<body>
<form name="posting" id="posting" method="post" action="">
<input type="button" class="button" value="Bold" id="bold" name="bold" onClick="tag('b', '<STRONG>', 'Bold*', '</STRONG>', 'Bold', 'bold');" onMouseOver="helpline('bold')" />
<input type="button" class="button" value="Italic" name="italic" id="italic" onClick="tag('i', '<EM>', 'Italic*', '</EM>', 'Italic', 'italic');" onMouseOver="helpline('italic')" />
<input type="button" class="button" value="Underline" name="underline" id="underline" onClick="tag('u', '<U>', 'Underline*', '</U>', 'Underline', 'underline');" onMouseOver="helpline('underline')" />
<input type="button" class="button" value="Strikethrough" name="strikethrough" id="strikethrough" onClick="tag('s', '[s]', 'Strikethrough*', '[/s]', 'Strikethrough', 'strikethrough');" onMouseOver="helpline('strikethrough')" />
<input type="button" class="button" value="Center" name="center" id="center" onClick="tag('center', '[center]', 'Center*', '[/center]', 'Center', 'center');" onMouseOver="helpline('center')" />
<input type="button" class="button" value="Quote" name="quote" id="quote" onClick="tag('q', '[quote]', 'Quote*', '[/quote]', 'Quote', 'quote');" onMouseOver="helpline('quote')" />
<input type="button" class="button" value="Url" name="url" id="url" onClick="tag('url', '<A href="', 'Url*', '" target=_blank $included="null">', 'Url*', '</A>', 'Url', 'url');" onMouseOver="helpline('url')" />
<input type="button" class="button" value="Img" name="img" id="img" onClick="tag('img', '[img]', 'Img*', '[/img]', 'Img', 'img');" onMouseOver="helpline('img')" />
<input type="button" class="button" value="Youtube" name="youtube" id="youtube" onClick="tag('youtube', '[youtube]', 'Youtube*', '[/youtube]', 'Youtube', 'youtube');" onMouseOver="helpline('youtube')" />
Font size: <select name="fontsize" onChange="font('[size=' + this.form.fontsize.options[this.form.fontsize.selectedIndex].value + ']', '[/size]');" onMouseOver="helpline('fontsize')" class="form_elements_dropdown">
<option value="7" >Tiny</option>
<option value="9" >Small</option>
<option value="18" >Large</option>
<option value="24" >Huge</option>
</select>
Font color: <select name="fontcolor" onChange="font('<SPAN>.value + ']', '</SPAN>'); this.selectedIndex=0;" onMouseOver="helpline('fontcolor')" class="form_elements_dropdown" >
<option value="black" style="color:black">Black</option>
<option value="silver" style="color:silver">Silver</option>
<option value="gray" style="color:gray">Gray</option>
<option value="maroon" style="color:maroon">Maroon</option>
<option value="red" style="color:red">Red</option>
<option value="purple" style="color:purple">Purple</option>
<option value="fuchsia" style="color:fuchsia">Fuchsia</option>
<option value="navy" style="color:navy">Navy</option>
<option value="blue" style="color:blue">Blue</option>
<option value="aqua" style="color:aqua">Aqua</option>
<option value="teal" style="color:teal">Teal</option>
<option value="lime" style="color:lime">Lime</option>
<option value="green" style="color:green">Green</option>
<option value="olive" style="color:olive">Olive</option>
<option value="yellow" style="color:yellow">Yellow</option>
<option value="white" style="color:white">White</option>
</select>
<input type="text" name="helpbox" id="helpbox" size="100" class="helpbox" readonly="readonly"/>
<hr />
<textarea name="post" cols="75" rows="25"></textarea>
<input type="submit" value="Post!" name="post" />
</form>
</body>
</html>
and i dont know what is the problem
thanks in advance for attention