Question

Ich versuche, Text am Ende eines Textarea mit jquery anhängen.

meine HTML-Code sieht wie folgt aus:

<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> 

und mein Skript den Text anzufügen ist:

$('#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'); 
    } 
}); 

bisher: - ich den Wert des Tropfens hinzufügen Down-Option zu der Textbereich ABER wenn ich es hinzufüge, löscht es den ganzen vorhandenen Text.

Wha ich erreichen möchte ist, dass ein Benutzer etwas Text in den Textbereich eingibt, der Benutzer wählt dann eine Option aus dem Dropdown im Textbereich und dann wird der Text des Dropdowns am Ende der eingegebenen hinzugefügt Text im Textbereich. Ich habe es aus Material online versucht, aber ich scheine es nicht richtig zu machen. Wo ich liege ich falsch?

hier ist ein Link zu einer Geige aus dem gleichen JS Fiddle

Answer 1

die text innerhalb eines textarea Sie die val() Funktion verwenden, um zu erhalten: $("#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 
    } 
}); 

Demo: https://jsfiddle.net/h2dp1oqu/8/

Answer 2

Ersetzen Sie Ihre zwei ersten Zeilen durch

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