jquery写一个可搜索下拉多选的输入框插件效果代码-html代码-BFW代码库

jquery写一个可搜索下拉多选的输入框插件效果代码

代码语言：html

代码描述：jquery写一个可搜索下拉多选的输入框插件效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/layui.css">
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" charset="utf-8">

        $.extend({
            myMethod: function(id, tagData, name) {
                var html = '<div class="layui-form-item">'; html += '<label class="layui-form-label">已选择:</label>'; html += '<div class="AD">'; html += '</div>'; html += '</div>'; html += '<div class="layui-form-item">'; html += '<label class="layui-form-label">选择</label>'; html += '<div class="layui-input-inline fileId layui-form-select layui-form-selected">'; html += '<input type="text" class="layui-input" placeholder="输入或选择" autocomplete="off">'; html += '<dl style="display: none;"></dl>'; html += '</div>'; html += '</div>'; $(id).append(html)
                $(".AD").parent().hide(); $(".fileId").on("click", "dl dd", function() {
                    var id = $(this).attr("value"); if (id != undefined) {
                        $(".AD").append('<a href="javascript:;" class="label"><span lay-value="64">'+$(this).html()+'</span><input type="hidden" name="'+name+'" id="'+$(this).html()+'" value="'+id+'"/><i class="close">x</i></a>')
                        $(".AD").parent().show(); for (var i = 0; i < tagData.length; i++) {
                            if (tagData[i].id == id) {
                                tagData.splice(i, 1);
                            }}}
                    $(".fileId dl").hide(); $(".fileId input").val("");
                })
                function AD(name,
                    id) {
                    this.name = name; this.id = id;
                }
                $(".AD").on("click",
                    ".close",
                    function() {
                        $(this).parent().remove(); var id = $(this).parent().children("input").val(); var text = $(this).parent().children("input").attr("id"); tagData.push(new AD(text, id))})
                $(".fileId input").on("input propertychange",
                    function() {
                        $(".fileId dl dd").remove(); $(".fileId dl").hide(); if (tagData.length > 0) {
                            $(".fileId dl").show(); var sear = new RegExp($(this).val())
                            var temp = 0; for (var i = 0; i < tagData.length; i++) {
                                if (sear.test(tagData[i].name)) {
                                    temp++
                                .........完整代码请登录后点击上方下载按钮下载查看