jquery - 選択したオプションの値（テキスト）をjQueryでテキストエリアに追加します

Question

選択リストの選択値を jQuery で判断し、その値をテキストエリアに追加したいと考えています。

それ、どうやったら出来るの？

<div id="myDiv">
    <a>Enter</a><br />
    <div>
      <textarea>

      </textarea>
    </div>
</div>

<div id="select">
<select>
  <option value="volvo">Option1</option>
  <option value="saab">Option2</option>
  <option value="mercedes">Option3</option>
  <option value="audi">Option4</option>
</select>
</div>


$('#myDiv a').click(function(){
$('#select select').appendTo('#myDiv');
$('#select').css('display','block');
       $('#select select').attr('selected').html().clone().appendTo('textarea');
});

フィドル

Answer 1

これを使って

HTML

 <div id="myDiv">
 <a>Enter</a><br />
 <div>
  <textarea>

  </textarea>
 </div>
 </div>
<input type="button" onclick="apv();" value="A1BC" id="ABCA"/>
<div id="select">
<select id="abc1">
  <option value="volvo">Option1</option>
  <option value="saab">Option2</option>
  <option value="mercedes">Option3</option>
  <option value="audi">Option4</option>
</select>
</div>

JS

$('#myDiv a').click(function(){
 $('#select select').appendTo('#myDiv');
 $('#select').css('display','block');
   $('#select select').attr('selected').html().clone().appendTo('textarea'); 
 });

$("#ABCA").click(function()
{
  var text1 = $('#abc1 option:selected').val();
  $('#myDiv textarea').html(text1);
  alert(text1);
});

デモ

Answer 2

これを使って

var text = $('#select option:selected').text().appendTo('textarea');

Answer 3

1. テキスト文字列を複製することはできず、要素のみを複製できます。
2. テキスト文字列を追加することはできません。jQuery オブジェクトのみを追加してください。HTMLまたはテキストを設定するには、メソッド.html()または.text()

解決：

// store textarea
var $ta = $('#myDiv textarea');

$('#myDiv a').click(function(){
    $('#select select').appendTo('#myDiv');
    $('#select').css('display','block');

    // get selected option text, not value
    // for value, use .val() instead of .text()
    var text = $('#myDiv select').find(':selected').text();

    // append selected value after a space
    $ta.text($ta.text() + ' ' + text);
});

http://jsfiddle.net/samliew/mF5GV/

Answer 4

$('選択オプション:選択済み');

:selected セレクターを使用して、現在選択されているオプションを判別します

Answer 5

これはあなたが意味するものですか？http://jsfiddle.net/V2cXf/

$('#myDiv a').click(function(){
    $('textarea').append($('#select select').val())
});