Div+ul仿的下拉复选框；2这个复选框选中的格式是做成标签形式；3这个标签不能有重复的；4可以删除标签。

使用方法
1、只做了ie9及以上的兼容，ie8的兼容以后会加上
2、部分代码注释如下：
点击输入框时候

$(".selectBox .imitationSelect").on("click", function() {
    $(this).parent().next().toggle(); //ul弹窗展开
    $(this).next().toggleClass("fa-caret-up") //点击input选择适合，小图标动态切换
    if ($(this).next().hasClass("fa-caret-down")) {
        $(this).next().removeClass("fa-caret-down").addClass("fa-caret-up") //点击input选择适合，小图标动态切换
    } else {
        $(this).next().addClass("fa-caret-down").removeClass("fa-caret-up") //点击input选择适合，小图标动态切换
    }
    if (event.stopPropagation) {
        // 针对 Mozilla 和 Opera   
        event.stopPropagation();
    } else if (window.event) {
        // 针对 IE   
        window.event.cancelBubble = true;
    }
});

点击右边箭头icon时候

$(".selectBox .fa").on("click", function() {
    $(this).parent().next().toggle(); //ul弹窗展开
    if ($(this).hasClass("fa-caret-down")) {
        $(this).removeClass("fa-caret-down").addClass("fa-caret-up") //点击input选择适合，小图标动态切换
    } else {
        $(this).addClass("fa-caret-down").removeClass("fa-caret-up") //点击input选择适合，小图标动态切换
    }
    if (event.stopPropagation) {
        // 针对 Mozilla 和 Opera   
        event.stopPropagation();
    } else if (window.event) {
        // 针对 IE   
        window.event.cancelBubble = true;
    }
});

定义一个存储数据的数组，用于下面重复选择判断，删除标签：

var oliIdArray = [];
$(".selectUl li").click(function(event) {
    event = event || window.event;
    $(this).addClass("actived_li").siblings().removeClass("actived_li"); //点击当前的添加。actived_li这个类；其他的移除这个类名
    var oliId = $(this).attr("oliId");
    if (oliIdArray.indexOf(oliId) > -1) {
    } else {
        oliIdArray.push(oliId);
        $(this).parent().prev().children().attr("oliId", oliIdArray); //把当前点击的oliId赋值到显示的input的oliId里面
        $("#role_select").append("<span class='person_root'><span>" + $(this).text() + "</span><i class='close' oliId='" + oliId + "' >x</i></span>");
    }
    //事件委托进行绑定事件，每个删除事件得以进行
    var role_select = document.getElementById("role_select");
    var role_span = role_select.getElementsByTagName('i');
    console.log("span的选择个数" + role_span.length)
    for (var i = 0; i < role_span.length; i++) {
        role_span[i].onclick = function() {
            var oliId = $(this).attr("oliId");
            console.log("oliId" + oliId)
            for (var i = 0; i < oliIdArray.length; i++) {
                if (oliIdArray[i] === oliId) { //表示数组里面有这个元素
                    var id = i; //元素位置
                    console.log(oliId)
                    console.log(id)
                    console.log(oliIdArray);
                    oliIdArray.splice(id, 1);
                }
            }
            console.log(oliIdArray);
            $(this).parent().remove();
            //console.log(oliIdArray)
            event.stopPropagation(event);
            event.preventDefault(event); //阻止浏览器默认行为  
        }
    }
});

点击任意地方隐藏下拉

$(document).click(function(event) {
    event = event || window.event;
    $(".inputCase .fa").removeClass("fa-caret-up").addClass("fa-caret-down") //当点隐藏ul弹窗时候，把小图标恢复原状
    $(".selectUl").hide(); //当点击空白处，隐藏ul弹窗
});