Question

要获取我正在使用的select2的所选值：

var x = $("#select").select2('data');
var select_choice = x.text

问题是，如果没有选择值，则抛出错误，我想知道是否有任何方法使其在没有选择选项的情况下返回占位符

Answer 1

您必须添加一个空选项（即<option></option>）作为查看占位符的第一个元素。

来自Select2官方文档：

＆＃34;请注意，由于浏览器假定在非多值选择框中选择了第一个选项元素，因此必须为占位符提供空的第一个选项元素（<option></option>）。＆＃34;

希望这有帮助。

示例：

<select id="countries">
    <option></option>
    <option value="1">Germany</option>
    <option value="2">France</option>
    <option value="3">Spain</option>
</select>

并且Javascript将是：

$('#countries').select2({
    placeholder: "Please select a country"
});

Answer 2

将它放在您的脚本文件中：

$('select').select2({
    minimumResultsForSearch: -1,
    placeholder: function(){
        $(this).data('placeholder');
    }
});

然后在HTML中添加以下代码：

<select data-placeholder="Your Placeholder" multiple>
    <option></option> <------ this is where your placeholder data will appear
    <option>Value 1</option>
    <option>Value 2</option>
    <option>Value 3</option>
    <option>Value 4</option>
    <option>Value 5</option>
</select>

Answer 3

$("#e2").select2({
   placeholder: "Select a State",
   allowClear: true
});
$("#e2_2").select2({
   placeholder: "Select a State"
});

占位符可以通过附加到select的data-placeholder属性声明，也可以通过占位符配置元素声明，如示例代码所示。

当占位符用于非多值选择框时，它要求您包含空标记作为第一个选项。

可选择使用清除按钮（选择后可见）可将选择框重置回占位符值。

https://select2.org/placeholders

Answer 4

$('#ddlSelect').prepend('<option selected=""></option>').select2({placeholder: "Select Month"});

Answer 5

这对我有用：

$('#SelectListId').prepend('<option selected></option>').select2({
    placeholder: "Select Month",
    allowClear: true
});

希望这有帮助：）

Answer 6

在html上使用空占位符，如：

<select class="select2" placeholder = "">
    <option value="1">red</option>
    <option value="2">blue</option>
</select>

并在您的脚本中使用：

$(".select2").select2({
        placeholder: "Select a color",
        allowClear: true
    });

Answer 7

我做了以下事情：

var defaultOption = new Option();
defaultOption.selected = true;    
$(".js-select2").append(defaultOption);

对于我使用的其他选项：

var realOption = new Option("Option Value", "id");
realOption.selected = false;    
$(".js-select2").append(realOption);

Answer 8

试试这个。在html中你写下面的代码。

var="example=value" && echo "$var" |  sed "s/^example=\(.*\)$/\1/"

在你的脚本中写下面的代码。请记住，它有select2js的链接。

var=$(echo "example=value" |  sed "s/^example=\(.*\)$/\1/")

Answer 9

最简单方式添加空＆＃34;选项＆＃34;毕竟。

<option></option>

示例：

<select class="select2" lang="ru" tabindex="-1">
    <option></option>
    <option value="AK">Alaska</option>
    <option value="HI">Hawaii</option>
</select>

如果需要，还可以使用js代码：

$(document).ready(function() {
    $(".select2").select2({
            placeholder: "Select a state",
            allowClear: true
        });
    });
}

Answer 10

您可以在两个级别中选择html代码来初始化占位符，例如：

<select class="form-control select2" style="width: 100%;" data-placeholder="Select a State">
   <option></option>
   <option>تهران</option>
   <option>مشهد</option>
   <option>اصفهان</option>
   <option>شیراز</option>
   <option>اهواز</option>
   <option>تبریز</option>
   <option>کرج</option>   
</select>

选择标签中的

1.set data-placeholder属性 2.在您选择的标签的第一个中设置空标签

Answer 11

在select2的当前版本中，您只需要添加属性data-placeholder="A NICE PLACEHOLDER"。 select2将自动分配占位符。请注意：仍然必须在选择中添加一个空的<option></option>。

Answer 12

我尝试了所有这些，最后，只使用了适用于我的系统的 title="text here"。注意没有空白选项

<select name="Restrictions" class="selectpicker show-tick form-control" 
        data-live-search="true" multiple="multiple" title="Choose Multiple">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
</select>

Answer 13

只需将此类添加到您的 .css 文件中即可。

.select2-search__field{width:100% !important;}

Answer 14

$selectElement.select2({
    minimumResultsForSearch: -1,
    placeholder: 'SelectRelatives'}).on('select2-opening', function() {                                                                       $(this).closest('li').find('input').attr('placeholder','Select Relative');                            
});

如何在select2框架中使用占位符作为默认值

14 个答案: