I have a multiselect box that contains a list of image urls. I am trying to enable a click event on the multiselect box: when a user clicks on a url, it should pass the url to a textarea with the id of "articleFullText". Below is my jquery code, however, it doesn't work and does not cause any error on JS console:
$('.multiselect').click(function() {
var src = $(this).val();
$('#articleFullText').val($('articleFullText').val() + src);
});
My selectbox html:
<div class="controls">
<select name="images" class="multiselect" multiple="multiple">
<option value="http://localhost/images/1.jpg">http://localhost/images/1.jpg</option>
<option value="http://localhost/images/2.jpg">http://localhost/images/2.jpg</option>
</select>
</div>
textarea code:
<textarea class="form-control" rows="3" name="articleFullText" id="articleFullText></textarea>
Two mistakes: http://jsfiddle.net/TrueBlueAussie/dGa97/1/
A missing # selector:
$('.multiselect').click(function () {
var src = $(this).val() +"blah";
$('#articleFullText').val($('#articleFullText').val() + src);
});
And a missing closing quote on id="articleFullText"
:
<textarea class="form-control" rows="3" name="articleFullText" id="articleFullText"></textarea>
You are missin the # on the selector:
$('#articleFullText').val($('articleFullText').val() + src);
change to:
$('#articleFullText').val($('#articleFullText').val() + src);
And the Id in the textarea has not a closing ""
change it to:
<textarea class="form-control" rows="3" name="articleFullText" id="articleFullText"></textarea>
You didn't use the right event (change).
$('.multiselect').on('change', function() {
$('#articleFullText').append($(this).val())
});
Here is a working fiddle : http://jsfiddle.net/9Ya27/1/
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.