Image placeholder

pickList – 基于jQuery和Bootstrap的列表选择插件

Image placeholder
F2EX 2016-12-11

picklist-simple-picklist-with-jquery-and-bootstrap

pickList 是一个简单的基于 jQuery 和 Bootstrap 的列表选择插件,它将常规多选项选择框转换为并排选择列表,具有单选、多选、单个移除、多个移除等功能。

用法

基本设置:


<div id="pickList"></div>  <!-- HTML -->

$("#pickList").pickList(); // JS

要将数据设置为插件只需包括:


var val = {
    01: {id: 01, text: 'Isis'},
    02: {id: 02, text: 'Sophia'},
    03: {id: 03, text: 'Alice'},
    04: {id: 04, text: 'Isabella'},
    05: {id: 05, text: 'Manuela'},
    06: {id: 06, text: 'Laura'}
  };

var pick = $("#pickList").pickList({data: val});

要获取数据,只需调用 getValues


 var pick = $("#pickList").pickList({data: val});

 $("#getSelected").click(function () {
     console.log(pick.getValues());
 });

2017-08-07