faqts : Computers : Programming : Languages : JavaScript : Forms : TextAreas/TextFields

+ Search
Add Entry AlertManage Folder Edit Entry Add page to http://del.icio.us/
Did You Find This Entry Useful?

18 of 29 people (62%) answered Yes
Recently 6 of 10 people (60%) answered Yes

Entry

How can I predefine text attributes to a text input field (like <b>)

Apr 8th, 2003 11:04
jsWalter, Peter Roosen,


This example shows you how to change the...
  - font
  - style
  - size
  - color
of text within a TEXTAREA
jsWalter
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<style>
	.demo
	{
		font-family: "Arial Black";
		font-weight: bold;
		font-style: italic;
		font-size: 8px;
	}
	TEXTAREA
	{
		color: black;
	}
</style>
<body>
<textarea id='t2' class="demo">this is a test</textarea>
<p> <p> <p>
Pick a Font:
<select onchange="setFont(this)">
	<option>Arial Black
	<option>Arial
	<option>Courier New
	<option>Tahoma
	<option>Verdana
</select>
<p>
Pick a Style:
<select onchange="setStyle(this)">
	<option>italic
	<option>normal
</select>
<p>
Pick a Size:
<select onchange="setSize(this)">
	<option>8
	<option>12
	<option>16
	<option>20
</select>
<p>
Pick a Color:
<select onchange="setColor(this)">
	<option>Black
	<option>Red
	<option>Green
	<option>Blue
	<option>Teal
</select>
<p>
</body>
<script>
var objTA = document.all.t2
function setFont( objSelect )
{
	objTA.style.fontFamily = objSelect.options
[objSelect.selectedIndex].text;
}
function setStyle( objSelect )
{
	objTA.style.fontStyle = objSelect.options
[objSelect.selectedIndex].text;
}
function setSize( objSelect )
{
	objTA.style.fontSize = objSelect.options
[objSelect.selectedIndex].text;
}
function setColor( objSelect )
{
	objTA.style.color = objSelect.options
[objSelect.selectedIndex].text;
}
</script>
</html>
<!-- *********************************************************** -->
<!-- CS-RCS Version Control Info
$Header: $
$Log: $
-->
<!-- eof -->