admin管理员组文章数量:1323335
I'm trying to append text at the end of a textarea using jquery.
my html code looks like this:
<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>
and my script to append the text is:
$('#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');
}
});
so far: - I can add the value of the drop down option to the text area BUT when I add it, it clears all the existing text.
Wha I want to achieve is that a user types some text in the text area, the user then selects an option from the dropdown under the text area and then, the text of the dropdown is added at the end of the typed text in the text area. I have tried from material online but I seem not to get it right. Where I'm I going wrong?
here is a link to a fiddle of the same JS Fiddle
I'm trying to append text at the end of a textarea using jquery.
my html code looks like this:
<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>
and my script to append the text is:
$('#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');
}
});
so far: - I can add the value of the drop down option to the text area BUT when I add it, it clears all the existing text.
Wha I want to achieve is that a user types some text in the text area, the user then selects an option from the dropdown under the text area and then, the text of the dropdown is added at the end of the typed text in the text area. I have tried from material online but I seem not to get it right. Where I'm I going wrong?
here is a link to a fiddle of the same JS Fiddle
Share Improve this question asked Apr 13, 2016 at 13:40 musalemusale 5848 silver badges18 bronze badges 2- Like this? – Guruprasad J Rao Commented Apr 13, 2016 at 13:44
- Previous answer: stackoverflow./questions/7058864/add-text-to-textarea-jquery – sjr59 Commented Apr 13, 2016 at 13:47
2 Answers
Reset to default 8To get the text
inside a textarea
you have to use the val()
function:
$("#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/h2dp1oqu/8/
Replace your two first lines with
var theMessage = $("#message").val();
var theDepartment = $("#departments").val();
本文标签: javascriptAppend text to the end of textarea using jQueryStack Overflow
版权声明:本文标题:javascript - Append text to the end of textarea using jQuery - Stack Overflow 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1742136345a2422388.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论