Heim > Web-Frontend > js-Tutorial > Hauptteil

Ausführliche Erläuterung von Beispielen für die Einzelauswahl und Mehrfachauswahl im Dropdown-Menü Angular Select2

零下一度
Freigeben: 2017-06-25 09:11:57
Original
6353 Leute haben es durchsucht

Kompatibilität:

Datei importieren

/select2.min.js/select2.min.css
Nach dem Login kopieren

HTML

<select class="form-control selectName" multiple="multiple">//设置class名为selectName;配置为多选 multiple
        <option value="1" disabled="disabled">本人</option>   //设置一项option为不可选 disabled="disabled"
        <option value="2">父母</option>
        <option value="3">配偶</option>
        <option value="4">子女</option>
        <option value="5">其他</option>
        <option value="6">全部</option>
</select>
Nach dem Login kopieren

js

$(".custAndInsRelationRange").select2({
     placeholder: "--请选择--";     //设置select的默认显示文字});
Nach dem Login kopieren

Anhang:

select2 ----- Einzelauswahl Wertzuweisung

html:

<select class="form-control premPeriod" ng-model="selectModel" ng-options="item.value as item.name for item in selectDataList"></select>
Nach dem Login kopieren
<em><br>//ng-model="selectModel" 设置ng-model,它的值等于 item.value<br><br>//selectDataList是接口数据</em>
Nach dem Login kopieren
//select下拉显示的值是item.name
Nach dem Login kopieren

js:

$(".premPeriod").select2({ placeholder: "--请选择--"; //初始化 });
Nach dem Login kopieren
$scope.selectModel= '' //直接操作ng-model上的值
Nach dem Login kopieren

select2 ----- Mehrfachauswahlwertzuweisung

html:

<select class="form-control premPeriod" multiple="multiple" id="premPeriod" ng-options="item.value as item.name for item in selectDataList">
        <option value="1">5</option>
        <option value="2">10</option>
        <option value="3">15</option>
        <option value="4">20</option>
</select>
Nach dem Login kopieren

js :

$(".premPeriod").select2({ placeholder: "--请选择--";  });//初始化
Nach dem Login kopieren
$scope.selectModel= $("#premPeriod").val();//取select值

$scope.defaultData = ['2','3'];//默认值
Nach dem Login kopieren
$(".premPeriod").val($scope.defaultData);//设置select的默认值
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung von Beispielen für die Einzelauswahl und Mehrfachauswahl im Dropdown-Menü Angular Select2. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage