是否可以通过jquery在文本框中显示未选中的选项？
是否可以通过jquery在文本框中显示未选中的选项？
提问于 2018-11-15 10:09:52
是否可以将另一个文本框中的选定值&未选择的选项显示到另一个文本框中。
例如，我有两个文本框&一个带有options(location_1,location_2,location_3)的选择框。
因此，当我选择选项location_2或任何然后选择的选项值将显示在text_box_1 &剩余未选择的选项(location_1,location_3)中时，该值将出现在另一个文本框中为text_box_2。
我尝试过以下几种方法，但只得到了select选项的值，而没有取消选择。
HTML
<select name="pd_location[]" class="form-control">
<option value="">-- Choose --</option>
<option value="1">Location One</option>
<option value="2">Location Two</option>
<option value="3">Location Three</option>
<option value="4">Location Four</option>
</select>Jquery
$(document).on('change', '.select_location', function() {
var get_sel_option = $(this).attr("selected_val");
var index= $(".select_location").prop('selectedIndex');
if(index){
var sel_option_test= $('.select_location option ').attr("selected","selected");
}
});如何获得取消选择的选项值？
回答 1
Stack Overflow用户
发布于 2018-11-15 10:41:41
您可以使用jQuery.map()获取所有未选中的选项。
描述:将数组或对象中的所有项转换为新的项数组。
$('select[name="pd_location[]"]').on("change", function() {
$('.text_box').val('');
var selected = this.value;
if( selected ) {
$('#text_box_1').val( selected );
var unselected = $(this).find('option:not(:first):not(:selected)').map(function() { return this.value; }).get().join(",");
$('#text_box_2').val( unselected );
}
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="pd_location[]" class="form-control">
<option value="">-- Choose --</option>
<option value="1">Location One</option>
<option value="2">Location Two</option>
<option value="3">Location Three</option>
<option value="4">Location Four</option>
</select>
<input name="text_box_1" id="text_box_1" class="text_box">
<input name="text_box_2" id="text_box_2" class="text_box">
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/53311435
复制相关文章
相似问题
腾讯云开发者
