Занесение текста в textarea при выборе options

Question

Занесение текста в textarea при выборе options

Рейтинг: 1Ответов: 2Опубликовано: 05.04.2011

В общем с динамическим списком разобрался, теперь проблема следующая. ) Мне нужно, чтобы при выборе options в textarea заносился текст, который будет прикреплен к opions'у. Например, есть форма

<form name="form1" action="" method="POST">
<select class=select id="brands_id" name="myselect"><option value="0">---
<option value="1">Toyota
<option value="2">Nissan
</select>
<textarea name="mytext">Какой-то текст!</textarea>
</form>

При помощи какого скрипта мне можно заставить, скажем, при выборе пункта Toyota выводить текст в textarea с описанием данной компании?

javascript html

Источник: Stack Overflow на русском

Answer 1

▲ 2

Вот как это можно сделать.

HTML:

<form>
<select id='select'>
    <option>---</option>
    <option>Nissan</option>
    <option>Toyota</option>
</select>
    <br/>
<textarea id='textarea1'></textarea>
    <br/>
<textarea id='textarea2'></textarea>
<div id='description1' style='display: none;'>nissan</div>
<div id='description2' style='display: none;'>toyota</div>
</form>

JavaScript/JQuery:

/*
 No jquery
*/
function onchange1(e)
{
    if (this.selectedIndex == 1) 
    {
        document.getElementById('textarea1').value = 'nissan';
    }
    if (this.selectedIndex == 2)
    {
        document.getElementById('textarea1').value = 'toyota';  
    }
}

document.getElementById('select').onchange = onchange1;

/* 
    JQuery
*/
function onchange2(e)
{
    if (this.selectedIndex == 1) 
    {
        $('#textarea2').text('nissan');
    }
    if (this.selectedIndex == 2)
    {
        $('#textarea2').text('toyota'); 
    }

}

$('#select').bind('change', onchange2);

$('#select').bind('change', function(){
    $('[id^=description]').hide();
    $('#description' + this.selectedIndex).show();
});

И по мелочам, тег option должен иметь закрывающий <option></option>.

И непонятно, зачем вы используете вывод в textarea, если это только описание, необходимое для пользователя как подсказка или что-то в этом духе.

По ссылке я сделал несколько примеров.

Answer 2

▲ 2

<script type="text/javascript">  
var descr = new Array();  
descr[0] = 'Выберите машину';  
descr[1] = 'Описание Тойоты';  
descr[2] = 'Описание Ниссана';  
function catalog_rebuild(x)  
{  
    document.getElementById("mytext").value = descr[x];  
}  
</script>  
<form name="form1" action="" method="POST">  
    <select class=select id="brands_id" name="myselect">  
        <option value="0">---</option>  
        <option value="1">Toyota</option>  
        <option value="2">Nissan</option>  
    </select>  
    <textarea name="mytext" id="mytext">Какой-то текст!</textarea>  
</form>

Хотя мне тоже больше нравится вариант без textarea:

<script type="text/javascript">  
var descr = new Array();  
descr[0] = 'Выберите машину';  
descr[1] = 'Описание Тойоты';  
descr[2] = 'Описание Ниссана';  
function catalog_rebuild(x)  
{  
    document.getElementById("mytext").innerHTML = descr[x];  
}  
</script>  
<form name="form1" action="" method="POST">  
    <select class=select id="brands_id" name="myselect">  
        <option value="0">---</option>  
        <option value="1">Toyota</option>  
        <option value="2">Nissan</option>  
    </select>  
    <div id="mytext">Какой-то текст!</div>  
</form>

Занесение текста в textarea при выборе options

Ответы