使用javascript获取所选文本select2

Get selected text select2 using javascript

本文关键字:文本 select2 javascript 获取 使用      更新时间:2023-09-26

我有一个select2输入字段,我可以成功地获得所有数据,但我想从下拉列表中获得d个选定数据的测试

这是我的select2输入字段

<%= f.input_field :lender_id, collection: Lender.all.pluck(:code, :id), id: 'lender_field_code', name: 'lender_field_code', class: 'form-control legal-service lender_field_code', prompt: 'Please Select Banker', disabled: (f.object.new_record? ? false : true ) %>

在我的javascript文件中,我有这个

var str1= $('.lender_field_code').select2("data").text();
 console.log(str1);

当我选择任何数据时,它会返回select2中的所有d数据,而不是我选择的数据。我该如何解决这个问题?

$(".lender_field_code").select2()
.on("change", function(e) {
   $("#select_val").html(e.val);
})

请查看此jsfiddle

尝试这个

    $( document ).ready(function() {
        $( ".lender_field_code" ).change(function() {
            alert( $(this).find("option:selected").text() );
        });
    });

你也可以试试这个在id为lender_field_code的select的change事件上,获取selected项目并使用.val() 读取其值

$('.lender_field_code').change(function() {   
    $('#select_val').append($('.lender_field_code :selected').val());
});

虽然上面提到的所有解决方案都能工作,但我不想使用on Change事件,然后我注意到

var text = $('.lender_field_code').select2("data").text();` 

将所选项目加上后面的任何项目作为数组返回,所以我使用了下面的解决方案

 var text = $('.lender_field_code').select2("data")[0].text();

index[0]是所选项目

如果你想要这个值,那么你甚至不需要on change
Select2 JS直接设置.val()属性,你可以像这个一样快速获取

var value= $('.lender_field_code').val();

如果您有多个使用Select2selects,则必须使用唯一的名称、id、类等指定目标,或者循环使用它们。