Bootstrap-Select - 如何保持静态标题？

简单的问题。我的选择下拉是这样的：Bootstrap-Select - 如何保持静态标题？

<select class="selectpicker" multiple data-container="body" data-title="Options" data-size="10" data-width="100%" data-selectedTextFormat="static" > 
    <option value="default">Test</option> 
</select>

我想，不管是选择什么样的，保持这一称号（“选项”）。即使我这样做：

$('.selectpicker').selectpicker('val', "default");

我希望它留在标题“选项”。我试过了，你可以看到，data-title和data-selectedTextFormat属性，但它没有奏效。

来源

2017-02-12 Mingle Li

你是说你不管用户选择什么你想要的值是“选项”？ –

@CesarBielich Precisely –

参见Options

选项可以通过数据传递属性或JavaScript。对于属性数据，选项名称追加到data-，如data-style=""或 data-selected-text-format="count"

你的数据属性是不正确的，应该是data-selected-text-format="static"。

使用数据属性

<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/css/bootstrap-select.min.css"> 
 

 
<div class="container"> 
 
    <select class="selectpicker" multiple data-title="Options" data-size="10" data-width="100%" data-selected-text-format="static"> 
 
    <option value="1">1</option> 
 
    <option value="2">2</option> 
 
    <option value="3">3</option> 
 
    <option value="4">4</option> 
 
    <option value="5">5</option> 
 
    <option value="6">6</option> 
 
    <option value="7">7</option> 
 
    <option value="8">8</option> 
 
    <option value="9">9</option> 
 
    <option value="10">10</option> 
 
    <option value="11">11</option> 
 
    <option value="12">12</option> 
 
    </select> 
 
</div> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/js/bootstrap-select.min.js"></script>

使用JavaScript

$('.selectpicker').selectpicker({ 
 
    selectedTextFormat: 'static', 
 
    width: '100%', 
 
    size: 10, 
 
    title: 'Options' 
 
});

<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/css/bootstrap-select.min.css"> 
 

 
<div class="container"> 
 
    <select class="selectpicker" multiple> 
 
    <option value="1">1</option> 
 
    <option value="2">2</option> 
 
    <option value="3">3</option> 
 
    <option value="4">4</option> 
 
    <option value="5">5</option> 
 
    <option value="6">6</option> 
 
    <option value="7">7</option> 
 
    <option value="8">8</option> 
 
    <option value="9">9</option> 
 
    <option value="10">10</option> 
 
    <option value="11">11</option> 
 
    <option value="12">12</option> 
 
    </select> 
 
</div> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/js/bootstrap-select.min.js"></script>

来源

2017-02-13 01:28:00 vanburen

哦，我现在看到，错误是数据属性错误。谢谢！ –

如果你想在默认情况下始终保持不变，不管用户选择什么，那么你可以只设置每个<option>相同的值，并更改标题

<select class="selectpicker" multiple data-container="body" data-title="Options" data-size="10" data-width="100%" data-selectedTextFormat="static" > 
    <option value="Options">Title1</option> 
    <option value="Options">Title2</option> 
    <option value="Options">Title3</option> 
    <option value="Options">Title4</option> 
    <option value="Options">Title5</option> 
    <option value="Options">Title6</option> 
</select>

，但我不知道你为什么会想要的。

来源

2017-02-13 00:26:35

Bootstrap-Select - 如何保持静态标题？

回答

相关问题