Heim >Web-Frontend >js-Tutorial >Wie implementiert das Bootstrap-Select-Plugin Mehrfachauswahlfelder? (Code)

Wie implementiert das Bootstrap-Select-Plugin Mehrfachauswahlfelder? (Code)

不言
不言Original
2018-09-14 17:34:471705Durchsuche
Der Inhalt dieses Artikels befasst sich mit der Frage, wie das Bootstrap-Select-Plugin Mehrfachauswahlfelder implementiert. (Code), es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird Ihnen hilfreich sein.

HeBeiTianQi.jsp-Seite

<!--bootstrap-select          .css引用-->
<link rel="stylesheet" href="static/bootstrap-select/bootstrap-select.min.css" />
<body>
<div class="col-sm-2" style="width:250px">
    <label class="control-label" for="txt_search_departmentname">灾害类别</label>
    <select class="selectpicker" multiple  id="disasterType" name="slt_followDisasterType">                        
        <option value="全部">全部</option>                        
        <option value="暴雨洪涝">暴雨洪涝</option>
        <option value="干旱">干旱</option>
        <option value="风灾">风灾</option>
        <option value="冰雹">冰雹</option>    
        <option value="雷电">雷电</option>
        <option value="大雾">大雾</option>    
        <option value="沙尘暴">沙尘暴</option>
        <option value="高温热浪">高温热浪</option>    
        <option value="渍涝">渍涝</option>
        <option value="干热风">干热风</option>    
        <option value="气象地质灾害">气象地质灾害</option>
        <option value="风暴潮">风暴潮</option>    
        <option value="病虫害">病虫害</option>
        <option value="森林草原火灾">森林草原火灾</option>    
        <option value="龙卷">龙卷</option>
    </select>
</div>
<!--bootstrap-select          .js引用-->
<script src="static/bootstrap-select/bootstrap-select.js"></script>
</body>

HeBeiTianQi.js

$(&#39;#disasterType&#39;).selectpicker(&#39;val&#39;, [&#39;全部&#39;]);//赋初始值
//获取   TianQi.jsp页面   选择的灾害类型值(可多选)
function disasterTypeVal(){    
    var optionSelect=$(&#39;#disasterType&#39;).find("option:selected").val(&#39;value&#39;);
    var optionSelectValArr=new Array();
    var len="";    
    for(var i=0,len=optionSelect.length;i<len;i++){
        var optionSelectVal=optionSelect[i].text;    //获取数组  option的值
        optionSelectValArr.push(optionSelectVal);    
    }    
    var disasterTypeStr=optionSelectValArr.join(",");
    return disasterTypeStr;
}

Verwandte Empfehlungen:

Dropdown-Feld mit Mehrfachauswahl auswählen Implementierung

Detaillierte Erklärung, wie AngularJs + Bootstrap das Dropdown-Auswahlfeld implementiert

Das obige ist der detaillierte Inhalt vonWie implementiert das Bootstrap-Select-Plugin Mehrfachauswahlfelder? (Code). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn