jQuery:获取所选文本作为逗号分隔的选择框

jQuery: get the selected text as comma separated from select box

本文关键字：分隔 选择 获取 文本 jQuery      更新时间：2023-10-18
<select id="testID" multiple="multiple">
   <option value="1">test Value1</option>
   <option value="2">test Value2</option>
   <option value="3">test Value3</option>
   <option value="4">test Value4</option>
   <option value="5">test Value5</option>
  <option value="6">test Value6</option>
</select>
<input type="button" value="Get dropdown selected Value" id ="select-values">

我想获取逗号分隔的选定文本。

我试过了

 $("#select-values").click(function () {
     $("select option:selected").text();
});

假设我选择了前两个选择选项但我得到了价值test Value1test Value2

我希望它test Value1,test Value2

尝试

小提琴演示 

$("#select-values").click(function () {
    var option_all = $("select option:selected").map(function () {
        return $(this).text();
    }).get().join(',');
    console.log(option_all);
});

这感觉是最快的方法：

$('#testID').val().toString()

我懒得为此写一个 for 循环

尝试：

var selectedItems = ($.map($("select[id*=select-values] option：selected"(， function(item， i( { 返回 $(item(.text(( }((.join("， "(;

试试这样的事情

$(document).ready(function () {
    $("#select-values").click(function () {
        var val = [];
        $("select option:selected").each(function () {
            val.push(this.text);
        });
        alert(val.join(','));
    });
});

您是否知道当您要获取多选框的值时，它会自动执行此操作？ ^^

只需更改所选内容的值：

<select id="testID" multiple="multiple">
   <option value="test Value1">test Value1</option>
   <option value="test Value2">test Value2</option>
   <option value="test Value3">test Value3</option>
   <option value="test Value4">test Value4</option>
   <option value="test Value5">test Value5</option>
  <option value="test Value6">test Value6</option>
</select>

然后，您可以使用以下命令调用该值：

$('#testID').val();

它将自动用逗号分隔值。

js小提琴

尝试：

$("#select-values").click(function () {
    var select = "";
    $("select option:selected").each(function(){
        select += ","+$(this).text();
    });
    if(select != ""){
        select = select.substr(1);
    }
    $("#selection").text(select);
});

在这里摆弄。

保持简单

$('#testID').val().join(', ');

选择的答案非常好。我制作并将这个函数与 $.fn 一起使用有多种用途，您可以从 jquery 对象中提取文本、val 或数据：

$.fn.QJoin = function(from, glue){
    glue = glue || ',';
    let aText = [];
    for(var i=0; i<this.length; i++){
        if( from=='text' ){ aText.push(this.eq(i).text()); }
        else if( from=='val' ){ aText.push(this.eq(i).val()); }
        else if( from.split('-')[0]=='data' ){ aText.push(this.eq(i).data(from.split('-')[1])); }
    }
    return aText.join(glue);
};
相关文章：