jQueryを使用してテキストエリアの末尾にテキストを追加します。

Question

jqueryを使用してテキストエリアの最後にテキストを追加しようとしています。

私のhtmlコードは次のようになります。

<textarea class='form-control' placeholder="Write something..." id="message" name="message" size='20'></textarea> 
<fieldset class="form-group"> 
    <div class="checkbox"> 
    <label for="deptList"> 
     <label for="departments" id="deptList">Select a department 
     <small>use this in case you've set up your account to <a 
               href="#"> include a department</a> at the end 
              of the text 
             </small> 
     </label> 
     <input type="checkbox" value="" class="checkbox-inline" id="deptCheck"> 
     <select class="form-control" id="departments"> 
     <option>Dept. 1</option> 
     <option>Dept. 2</option> 
     <option>Dept. 3</option> 
     <option>Dept. 4</option> 
     <option>Dept. 5</option> 
     <option>Dept. 6</option> 
     <option>Dept. 7</option> 
     </select> 
    </label> 
    </div> 

</fieldset> 

とテキストを追加するには、私のスクリプトは次のとおりです。

$('#deptCheck').click(function() { 
    var theMessage = $("#message").text(); 
    var theDepartment = $("#departments").find(":selected").text(); 

    if ($(this).is(":checked")) { 

     console.log(theMessage + theDepartment); 
     $("#message").val(theMessage + theDepartment); 
    }else { 
     alert('you have included department in your text, please remove it to avoid extra charges'); 
    } 
}); 

これまで： - 私はダウンオプション降下の値を追加することができますテキスト領域を追加すると、既存のテキストがすべて消去されます。

私が達成したいのは、ユーザーがテキスト領域にテキストを入力し、ユーザーがテキスト領域のドロップダウンからオプションを選択した後、ドロップダウンのテキストが入力後に追加されることですテキスト領域のテキスト。私は材料オンラインから試してみましたが、私はそれを正しく取得していないようです。私はどこが間違っているの？

ここ

はあなたがval()機能を使用する必要がtextarea内textを取得するために、同じJS Fiddle

Answer 1

のバイオリンへのリンクです： $("#message").val();

$('#deptCheck').click(function() { 

    var theMessage = $("#message").val(); 
    var theDepartment = $("#departments").find(":selected").text(); 

    if ($(this).is(":checked")) { 

    console.log(theMessage + theDepartment); 
    $("#message").val(theMessage + theDepartment); 
    } else { 
    alert('you have included department in your text, please remove it to avoid extra charges') //disable input 
    } 
}); 

デモ：https://jsfiddle.net/h2dp1oqu/8/

Answer 2

を最初の2行を

に置き換えてください1

var theMessage = $("#message").val(); 
var theDepartment = $("#departments").val();