Не выбирается title с select

[alex.m]

Добрый день, подскажите пожалуйста в чем проблема.
У меня есть выподающий список с 4 цветами
Красный.зеленый,Желтый,Синий.

Моя задача в том чтобы при выборе одного из них title списка ставился в тектовове поле. Чтобы в дальнейшем через PHP(Регулярные выражения ) менять их.

  <select size="1" id="sel" class='sel'>
            <option value=1 title='[FONT=RED]'  onclick="selText()" id="red"><b>Красный</b></option>
            <option value=2 title='[FONT=GREEN]'  onclick="selText()" id="green"><b>Зеленый</b></option>
            <option value=3 title='[FONT=YELLOW]'  onclick="selText()" id="yellow"><b>Желтый</b></option>
            <option value=4 title='[FONT=BLUE]'  onclick="selText()" id="blue"><b>Синий</b></option>
        </select>

Вот скрипт JavaScript

 function formatText(param)

        {

            var but = document.getElementById(param);

            var result = form.text.value + but.title;

            form.text.value = result;

            return but.title;

        }



        function selText()

        {

            var sel = document.getElementById("sel");

            switch(sel)

            {

                case 1: formatText('red');  break;

                case 2: formatText('green');  break;

                case 3: formatText('yellow');  break;

                case 4: formatText('blue');  break;

            }

        }

formatText(параметр) работает к примеру для кнопки button которая форматирует шрифт. Однако ни в какую не работает в select.
Подскажите пожалуйста в чем может быть проблема спасибо.

 

[alex.m]

Исправил кое что , но почему то не помогает.
В textarea ставится только ДАЖЕ ПРИ ВЫБОРЕ ДРУГИХ ЦВЕТОВ
В чем может быть проблема?

<form name="form">
  <select name="genre">
    <option value="[FONT=RED]">Красный</option>
    <option value="[FONT=GREEN]">Зеленый</option>
    <option value="[FONT=BLUE]">Синий</option>
  </select>
  <textarea cols='30' rows='4' id="text"></textarea>
</form>

<script>
var select = document.forms[0].elements.genre;

for (var i = 0; i < select.options.length; i++) {
  var option = select.options[i];
  if(option.selected) {
   var result = document.getElementById("text").value + option.value;
   document.getElementById("text").value = result;
  }
}
</script>

 

[Citizen0]

Вам нужно использовать onchange

<form name="form">
  <select name="genre" onchange="selText(this)">
    <option value="[FONT=RED]">Красный</option>
    <option value="[FONT=GREEN]">Зеленый</option>
    <option value="[FONT=BLUE]">Синий</option>
  </select>
  <textarea cols='30' rows='4' id="text"></textarea>
</form>

<script>
function selText(select) {
    document.getElementById("text").value = select.value;
}
</script>

 

[alex.m]

Вам нужно использовать onchange

<form name="form">
  <select name="genre" onchange="selText(this)">
    <option value="[FONT=RED]">Красный</option>
    <option value="[FONT=GREEN]">Зеленый</option>
    <option value="[FONT=BLUE]">Синий</option>
  </select>
  <textarea cols='30' rows='4' id="text"></textarea>
</form>

<script>
function selText(select) {
    document.getElementById("text").value = select.value;
}
</script>

Спасибо большое!