|
|
Posted by jojo on 07/25/06 23:09
2ontheway schrieb:
> Hello,
> I am new at this and have a question. I have created a combobox and
> have written a bit of javascript so that based on my selection the
> value of that option will be displayed in a text area. Now, my
> question is, i need to have it displayed with some of the words in the
> value a different color at the very least bold. for instance, in my
> code below, you will see the value for the options. in those option
> values I want, for instance, car and garage to be a different color or
> bold, but the rest to be default. Can anyone help me?
> If it isn't possible, can anyone suggest something that will work that
> basically lets the user choose an option and it return a block of text
> and within that text SOME of the words are a different font?
> Thanks
>
>
> <SCRIPT language="JavaScript" type="text/javascript">
> <!--
> function OnUpdateValue(ComboList)
> {
> var strValue = ComboList.options[ComboList.selectedIndex].value;
>
> if (strValue)
> {
> TextArea1.value = strValue;
> }
> }
> //-->
> </SCRIPT><select name="Combobox1" size="1"
> style="width:232px;height:21px;font-family:Arial;font-size:12px;"
> onchange="OnUpdateValue(this)";>
> <option selected></option>
> <option value="the car is in the garage"
> <option value="The fox is in the house"
> <option value="L2B">Background - Column 2</option>
> <option value="TBD">Background - Column 3</option>
> </select>
>
It is not possible to color words in a textarea. You can just color the
whole text in it with the same color. If you want to color just a few
words you have to use a <p>, <div>, <span> or any other HTML-Element.
In case that you do not know how to change the content of HTML-elements:
document.getElementById("ELEMENT_ID").innerHTML="new content"
To color a word - let's say red - you have to wrap it in a <span
style="color:red">
In your example the code would look like this:
<script language="JavaScript" type="text/javascript">
function OnUpdateValue(ComboList)
{
var strValue = ComboList.options[ComboList.selectedIndex].value;
if (strValue)
{
strValue = strValue.replace("car","<span style=\"color:red\">car</span>");
strValue = strValue.replace("garage","<span
style=\"color:red\">garage</span>");
//add the line above for every word you want to color
document.getElementById("display").innerHTML = strValue;
}
}
</script>
<select name="Combobox1" size="1"
style="width:232px;height:21px;font-family:Arial;font-size:12px;"
onchange="OnUpdateValue(this)";>
<option selected></option>
<option value="the car is in the garage"
<option value="The fox is in the house"
<option value="L2B">Background - Column 2</option>
<option value="TBD">Background - Column 3</option>
</select>
<div id="display"></div>
Perhaps there is an easier way to color the words than specify every
single word, but than I have to know if this a special words, for
example every second word? Or do all options look like this:
The * is in the * ?
HTH, jojo
Navigation:
[Reply to this message]
|