Javascript 如何基于下拉选择填充文本区域

我对这件事非常感兴趣。我可以使用js根据html下拉选择填充html文本区域吗？如果可以，我该怎么做？

您可能是指这样的内容： 告诉我是否对你有帮助

HTML:

---

对这非常感谢你！我应该能想出我想用这个做什么。再次感谢你！它没有像我想象的那样工作。我将尝试更详细地描述我需要什么，当我从下拉列表中选择“item1”时，我想填充一个相关项目的列表，并且我希望所有这些填充的项目都是可选择的，以便我可以将它们拖放到不同的区域。我希望这是有道理的！

<h1>Note Generator</h1>

<div class="left">
CSTemplates
<p>
<select class="c10" onchange="showCSTemplates(this);"> 
<option selected="selected" value="" id="Templates">Please select a template...</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
</p>
<p>
<textarea cols="30" rows="20" readonly="readonly" id="CSTemplates">
Templates will auto-populate 
here depending on the 
selection made from the 

[CSTemplates] 

drop-down list.
</textarea>
</p>
</div><!--left ends here-->

function showCSTemplates(sel){   

locations =[ "", /*this remains blank for first selection in drop-down list*/ 

/*option 1*/                 
" This is template 1 that  will appear in a textarea keeping its formatting as  is. ",

/*option 2*/                
" This is template 2 that  will appear in a textarea keeping its  formatting as  is. Credentials:  Contact Info: ",

/*option 3*/                 
" This is template 3 that  will appear in a textarea keeping its formatting as  is. Donec tortor lorem,  ornare vitae commodo nec,  sagittis et nunc. Maecenas sagittis quam ",

/*option 4*/                 
"etc",

/*option 5*/                 
"etc...", ];
                   srcLocation = locations    [sel.selectedIndex];    
   if (srcLocation != undefined && srcLocation != "") {      
                  document.getElementById('CSTemplates').innerHTML= srcLocation;   
 } 
}