hr / credit_hr · Files

/**
 * bootstrap-suggest-plugin - v0.1.29
 * @description 这是一个基于 bootstrap 按钮式下拉菜单组件的搜索建议插件，必须使用于按钮式下拉菜单组件上。
 * @author lzwme - https://lzw.me
 * @GitHub https://github.com/lzwme/bootstrap-suggest-plugin.git
 * @since 2019-11-18 09:30:06
 */
(function(factory) {
  if (typeof define === "function" && define.amd) {
    define(["jquery"], factory);
  } else if (typeof exports === "object" && typeof module === "object") {
    factory(require("jquery"));
  } else if (window.jQuery) {
    factory(window.jQuery);
  } else {
    throw new Error("Not found jQuery.");
  }
})(function($) {
  var VERSION = "VERSION_PLACEHOLDER";
  var $window = $(window);
  var isIe = "ActiveXObject" in window; // 用于对 IE 的兼容判断
  var inputLock; // 用于中文输入法输入时锁定搜索

  // ie 下和 chrome 51 以上浏览器版本，出现滚动条时不计算 padding
  var chromeVer = navigator.userAgent.match(/Chrome\/(\d+)/);
  if (chromeVer) {
    chromeVer = +chromeVer[1];
  }
  var notNeedCalcPadding = isIe || chromeVer > 51;

  // 一些常量
  var BSSUGGEST = "bsSuggest";
  var onDataRequestSuccess = "onDataRequestSuccess";
  var DISABLED = "disabled";
  var TRUE = true;
  var FALSE = false;

  function isUndefined(val) {
    return val === void 0;
  }

  /**
   * 错误处理
   */
  function handleError(e1, e2) {
    if (!window.console || !window.console.trace) {
      return;
    }
    console.trace(e1);
    if (e2) {
      console.trace(e2);
    }
  }
  /**
   * 获取当前 tr 列的关键字数据
   */
  function getPointKeyword($list) {
    return $list.data();
  }
  /**
   * 设置或获取输入框的 alt 值
   */
  function setOrGetAlt($input, val) {
    return isUndefined(val) ? $input.attr("alt") : $input.attr("alt", val);
  }
  /**
   * 设置或获取输入框的 data-id 值
   */
  function setOrGetDataId($input, val) {
    return val !== void 0
      ? $input.attr("data-id", val)
      : $input.attr("data-id");
  }
  /**
   * 设置选中的值
   */
  function setValue($input, keywords, options) {
    if (!keywords || !keywords.key) {
      return;
    }

    var separator = options.separator || ",",
      inputValList,
      inputIdList,
      dataId = setOrGetDataId($input);

    if (options && options.multiWord) {
      inputValList = $input.val().split(separator);
      inputValList[inputValList.length - 1] = keywords.key;

      //多关键字检索支持设置id --- 存在 bug，不建议使用
      if (!dataId) {
        inputIdList = [keywords.id];
      } else {
        inputIdList = dataId.split(separator);
        inputIdList.push(keywords.id);
      }

      setOrGetDataId($input, inputIdList.join(separator))
        .val(inputValList.join(separator))
        .focus();
    } else {
      setOrGetDataId($input, keywords.id || "")
        .val(keywords.key)
        .focus();
    }

    $input
      .data("pre-val", $input.val())
      .trigger("onSetSelectValue", [
        keywords,
        (options.data.value || options._lastData.value)[keywords.index]
      ]);
  }
  /**
   * 调整选择菜单位置
   * @param {Object} $input
   * @param {Object} $dropdownMenu
   * @param {Object} options
   */
  function adjustDropMenuPos($input, $dropdownMenu, options) {
    if (!$dropdownMenu.is(":visible")) {
      return;
    }

    var $parent = $input.parent();
    var parentHeight = $parent.height();
    var parentWidth = $parent.width();

    if (options.autoDropup) {
      setTimeout(function() {
        var offsetTop = $input.offset().top;
        var winScrollTop = $window.scrollTop();
        var menuHeight = $dropdownMenu.height();

        if (
          // 自动判断菜单向上展开
          $window.height() + winScrollTop - offsetTop < menuHeight && // 假如向下会撑长页面
          offsetTop > menuHeight + winScrollTop // 而且向上不会撑到顶部
        ) {
          $parent.addClass("dropup");
        } else {
          $parent.removeClass("dropup");
        }
      }, 10);
    }

    // 列表对齐方式
    var dmcss = {};
    if (options.listAlign === "left") {
      dmcss = {
        left: $input.siblings("div").width() - parentWidth,
        right: "auto"
      };
    } else if (options.listAlign === "right") {
      dmcss = {
        left: "auto",
        right: 0
      };
    }

    // ie 下，不显示按钮时的 top/bottom
    if (isIe && !options.showBtn) {
      if (!$parent.hasClass("dropup")) {
        dmcss.top = parentHeight;
        dmcss.bottom = "auto";
      } else {
        dmcss.top = "auto";
        dmcss.bottom = parentHeight;
      }
    }

    // 是否自动最小宽度
    if (!options.autoMinWidth) {
      dmcss.minWidth = parentWidth;
    }
    /* else {
            dmcss['width'] = 'auto';
        }*/

    $dropdownMenu.css(dmcss);

    return $input;
  }
  /**
   * 设置输入框背景色
   * 当设置了 indexId，而输入框的 data-id 为空时，输入框加载警告色
   */
  function setBackground($input, options) {
    var inputbg, bg, warnbg;
    if ((options.indexId === -1 && !options.idField) || options.multiWord) {
      return $input;
    }

    bg = options.inputBgColor;
    warnbg = options.inputWarnColor;

    var curVal = $input.val();
    var preVal = $input.data("pre-val");

    if (setOrGetDataId($input) || !curVal) {
      $input.css("background", bg || "");

      if (!curVal && preVal) {
        $input.trigger("onUnsetSelectValue").data("pre-val", "");
      }

      return $input;
    }

    inputbg = $input
      .css("backgroundColor")
      .replace(/ /g, "")
      .split(",", 3)
      .join(",");
    // 自由输入的内容，设置背景色
    if (!~warnbg.indexOf(inputbg)) {
      $input
        .trigger("onUnsetSelectValue") // 触发取消data-id事件
        .data("pre-val", "")
        .css("background", warnbg);
    }

    return $input;
  }
  /**
   * 调整滑动条
   */
  function adjustScroll($input, $dropdownMenu, options) {
    // 控制滑动条
    var $hover = $input.parent().find("tbody tr." + options.listHoverCSS),
      pos,
      maxHeight;

    if ($hover.length) {
      pos = ($hover.index() + 3) * $hover.height();
      maxHeight = +$dropdownMenu.css("maxHeight").replace("px", "");

      if (pos > maxHeight || $dropdownMenu.scrollTop() > maxHeight) {
        pos = pos - maxHeight;
      } else {
        pos = 0;
      }

      $dropdownMenu.scrollTop(pos);
    }
  }
  /**
   * 解除所有列表 hover 样式
   */
  function unHoverAll($dropdownMenu, options) {
    $dropdownMenu
      .find("tr." + options.listHoverCSS)
      .removeClass(options.listHoverCSS);
  }
  /**
   * 验证 $input 对象是否符合条件
   *   1. 必须为 bootstrap 下拉式菜单
   *   2. 必须未初始化过
   */
  function checkInput($input, $dropdownMenu, options) {
    if (
      !$dropdownMenu.length || // 过滤非 bootstrap 下拉式菜单对象
      $input.data(BSSUGGEST) // 是否已经初始化的检测
    ) {
      return FALSE;
    }

    $input.data(BSSUGGEST, {
      options: options
    });

    return TRUE;
  }
  /**
   * 数据格式检测
   * 检测 ajax 返回成功数据或 data 参数数据是否有效
   * data 格式：{"value": [{}, {}...]}
   */
  function checkData(data) {
    var isEmpty = TRUE,
      o;

    for (o in data) {
      if (o === "value") {
        isEmpty = FALSE;
        break;
      }
    }
    if (isEmpty) {
      handleError("返回数据格式错误!");
      return FALSE;
    }
    if (!data.value.length) {
      // handleError('返回数据为空!');
      return FALSE;
    }

    return data;
  }
  /**
   * 判断字段名是否在 options.effectiveFields 配置项中
   * @param  {String} field   要判断的字段名
   * @param  {Object} options
   * @return {Boolean}        effectiveFields 为空时始终返回 true
   */
  function inEffectiveFields(field, options) {
    var effectiveFields = options.effectiveFields;

    return !(
      field === "__index" ||
      (effectiveFields.length && !~$.inArray(field, effectiveFields))
    );
  }
  /**
   * 判断字段名是否在 options.searchFields 搜索字段配置中
   */
  function inSearchFields(field, options) {
    return ~$.inArray(field, options.searchFields);
  }
  /**
   * 通过下拉菜单显示提示文案
   */
  function showTip(tip, $input, $dropdownMenu, options) {
    $dropdownMenu
      .html('<div style="padding:10px 5px 5px">' + tip + "</div>")
      .show();
    adjustDropMenuPos($input, $dropdownMenu, options);
  }
  /**
   * 显示下拉列表
   */
  function showDropMenu($input, options) {
    var $dropdownMenu = $input.parent().find("ul:eq(0)");
    if (!$dropdownMenu.is(":visible")) {
      // $dropdownMenu.css('display', 'block');
      $dropdownMenu.show();
      $input.trigger("onShowDropdown", [options ? options.data.value : []]);
    }
  }
  /**
   * 隐藏下拉列表
   */
  function hideDropMenu($input, options) {
    var $dropdownMenu = $input.parent().find("ul:eq(0)");
    if ($dropdownMenu.is(":visible")) {
      // $dropdownMenu.css('display', '');
      $dropdownMenu.hide();
      $input.trigger("onHideDropdown", [options ? options.data.value : []]);
    }
  }
  /**
   * 下拉列表刷新
   * 作为 fnGetData 的 callback 函数调用
   */
  function refreshDropMenu($input, data, options) {
    var $dropdownMenu = $input.parent().find("ul:eq(0)"),
      len,
      i,
      field,
      index = 0,
      tds,
      html = [
        '<table class="table table-condensed table-sm" style="margin:0">'
      ],
      idValue,
      keyValue; // 作为输入框 data-id 和内容的字段值
    var dataList = data.value;

    if (!data || !(len = dataList.length)) {
      if (options.emptyTip) {
        showTip(options.emptyTip, $input, $dropdownMenu, options);
      } else {
        $dropdownMenu.empty();
        hideDropMenu($input, options);
      }
      return $input;
    }

    // 相同数据，不用继续渲染了
    if (
      options._lastData &&
      JSON.stringify(options._lastData) === JSON.stringify(data) &&
      $dropdownMenu.find("tr").length === len
    ) {
      showDropMenu($input, options);
      return adjustDropMenuPos($input, $dropdownMenu, options);
    }
    options._lastData = data;

    /** 显示于列表中的字段 */
    var columns = options.effectiveFields.length
      ? options.effectiveFields
      : $.map(dataList[0], function(val, key) {
          return key;
        });

    // 生成表头
    if (options.showHeader) {
      html.push("<thead><tr>");
      $.each(columns, function(index, field) {
        if (!inEffectiveFields(field, options)) return;

        html.push(
          "<th>",
          options.effectiveFieldsAlias[field] || field,
          index === 0 ? "(" + len + ")" : "", // 表头第一列记录总数
          "</th>"
        );

        index++;
      });
      html.push("</tr></thead>");
    }
    html.push("<tbody>");

    // console.log(data, len);
    // 按列加数据
    var dataI;
    var maxOptionCount = Math.min(options.maxOptionCount, len);
    for (i = 0; i < maxOptionCount; i++) {
      index = 0;
      tds = [];
      dataI = dataList[i];
      idValue = dataI[options.idField];
      keyValue = dataI[options.keyField];

      for (field in dataI) {
        // 标记作为 value 和 作为 id 的值
        if (isUndefined(keyValue) && options.indexKey === index) {
          keyValue = dataI[field];
        }
        if (isUndefined(idValue) && options.indexId === index) {
          idValue = dataI[field];
        }
        index++;
      }

      $.each(columns, function(index, field) {
        // 列表中只显示有效的字段
        if (inEffectiveFields(field, options)) {
          tds.push('<td data-name="', field, '">', dataI[field], "</td>");
        }
      });

      html.push(
        '<tr data-index="',
        dataI.__index || i,
        '" data-id="',
        idValue,
        '" data-key="',
        keyValue,
        '">',
        tds.join(""),
        "</tr>"
      );
    }
    html.push("</tbody></table>");

    $dropdownMenu.html(html.join(""));
    showDropMenu($input, options);
    //.show();

    // scrollbar 存在时，延时到动画结束时调整 padding
    setTimeout(function() {
      if (notNeedCalcPadding) {
        return;
      }

      var $table = $dropdownMenu.find("table:eq(0)"),
        pdr = 0,
        mgb = 0;

      if (
        $dropdownMenu.height() < $table.height() &&
        +$dropdownMenu.css("minWidth").replace("px", "") < $dropdownMenu.width()
      ) {
        pdr = 18;
        mgb = 20;
      }

      $dropdownMenu.css("paddingRight", pdr);
      $table.css("marginBottom", mgb);
    }, 301);

    adjustDropMenuPos($input, $dropdownMenu, options);

    return $input;
  }
  /**
   * ajax 获取数据
   * @param  {Object} options
   * @return {Object}         $.Deferred
   */
  function ajax(options, keyword) {
    keyword = keyword || "";

    var preAjax = options._preAjax;

    if (preAjax && preAjax.abort && preAjax.readyState !== 4) {
      // console.log('abort pre ajax');
      preAjax.abort();
    }

    var ajaxParam = {
      type: "GET",
      dataType: options.jsonp ? "jsonp" : "json",
      timeout: 5000
    };

    // jsonp
    if (options.jsonp) {
      ajaxParam.jsonp = options.jsonp;
    }

    // 自定义 ajax 请求参数生成方法
    var adjustAjaxParam,
      fnAdjustAjaxParam = options.fnAdjustAjaxParam;

    if ($.isFunction(fnAdjustAjaxParam)) {
      adjustAjaxParam = fnAdjustAjaxParam(keyword, options);

      // options.fnAdjustAjaxParam 返回false，则终止 ajax 请求
      if (FALSE === adjustAjaxParam) {
        return;
      }

      $.extend(ajaxParam, adjustAjaxParam);
    }

    // url 调整
    ajaxParam.url = (function() {
      if (!keyword || ajaxParam.data) {
        return ajaxParam.url || options.url;
      }

      var type = "?";
      if (/=$/.test(options.url)) {
        type = "";
      } else if (/\?/.test(options.url)) {
        type = "&";
      }

      return options.url + type + encodeURIComponent(keyword);
    })();

    return (options._preAjax = $.ajax(ajaxParam)
      .done(function(result) {
        options.data = options.fnProcessData(result);
      })
      .fail(function(err) {
        if (options.fnAjaxFail) {
          options.fnAjaxFail(err, options);
        }
      }));
  }
  /**
   * 检测 keyword 与 value 是否存在互相包含
   * @param  {String}  keyword 用户输入的关键字
   * @param  {String}  key     匹配字段的 key
   * @param  {String}  value   key 字段对应的值
   * @param  {Object}  options
   * @return {Boolean}         包含/不包含
   */
  function isInWord(keyword, key, value, options) {
    value = $.trim(value);

    if (options.ignorecase) {
      keyword = keyword.toLocaleLowerCase();
      value = value.toLocaleLowerCase();
    }

    return (
      value &&
      (inEffectiveFields(key, options) || inSearchFields(key, options)) && // 必须在有效的搜索字段中
      (~value.indexOf(keyword) || // 匹配值包含关键字
        (options.twoWayMatch && ~keyword.indexOf(value))) // 关键字包含匹配值
    );
  }
  /**
   * 通过 ajax 或 json 参数获取数据
   */
  function getData(keyword, $input, callback, options) {
    var data,
      validData,
      filterData = {
        value: []
      },
      i,
      key,
      len,
      fnPreprocessKeyword = options.fnPreprocessKeyword;

    keyword = keyword || "";
    // 获取数据前对关键字预处理方法
    if ($.isFunction(fnPreprocessKeyword)) {
      keyword = fnPreprocessKeyword(keyword, options);
    }

    // 给了url参数，则从服务器 ajax 请求
    // console.log(options.url + keyword);
    if (options.url) {
      var timer;
      if (options.searchingTip) {
        timer = setTimeout(function() {
          showTip(
            options.searchingTip,
            $input,
            $input.parent().find("ul"),
            options
          );
        }, 600);
      }

      ajax(options, keyword)
        .done(function(result) {
          callback($input, options.data, options); // 为 refreshDropMenu
          $input.trigger(onDataRequestSuccess, result);
          if (options.getDataMethod === "firstByUrl") {
            options.url = null;
          }
        })
        .always(function() {
          timer && clearTimeout(timer);
        });
    } else {
      // 没有给出 url 参数，则从 data 参数获取
      data = options.data;
      validData = checkData(data);
      // 本地的 data 数据，则在本地过滤
      if (validData) {
        if (keyword) {
          // 输入不为空时则进行匹配
          len = data.value.length;
          for (i = 0; i < len; i++) {
            for (key in data.value[i]) {
              if (
                data.value[i][key] &&
                isInWord(keyword, key, data.value[i][key] + "", options)
              ) {
                filterData.value.push(data.value[i]);
                filterData.value[filterData.value.length - 1].__index = i;
                break;
              }
            }
          }
        } else {
          filterData = data;
        }
      }

      callback($input, filterData, options);
    } // else
  }
  /**
   * 数据处理
   * url 获取数据时，对数据的处理，作为 fnGetData 之后的回调处理
   */
  function processData(data) {
    return checkData(data);
  }
  /**
   * 取得 clearable 清除按钮
   */
  function getIClear($input, options) {
    var $iClear = $input.prev("i.clearable");

    // 是否可清除已输入的内容(添加清除按钮)
    if (options.clearable && !$iClear.length) {
      $iClear = $(
        '<i class="clearable glyphicon glyphicon-remove fa fa-plus"></i>'
      ).prependTo($input.parent());
    }

    return $iClear
      .css({
        position: "absolute",
        top: "calc(50% - 6px)",
        transform: "rotate(45deg)",
        // right: options.showBtn ? Math.max($input.next('.input-group-btn').width(), 33) + 2 : 12,
        zIndex: 4,
        cursor: "pointer",
        width: "14px",
        lineHeight: "14px",
        textAlign: "center",
        fontSize: 12
      })
      .hide();
  }
  /**
   * 默认的配置选项
   * @type {Object}
   */
  var defaultOptions = {
    url: null, // 请求数据的 URL 地址
    jsonp: null, // 设置此参数名，将开启jsonp功能，否则使用json数据结构
    data: {
      value: []
    }, // 提示所用的数据，注意格式
    indexId: 0, // 每组数据的第几个数据，作为input输入框的 data-id，设为 -1 且 idField 为空则不设置此值
    indexKey: 0, // 每组数据的第几个数据，作为input输入框的内容
    idField: "", // 每组数据的哪个字段作为 data-id，优先级高于 indexId 设置（推荐）
    keyField: "", // 每组数据的哪个字段作为输入框内容，优先级高于 indexKey 设置（推荐）

    /* 搜索相关 */
    autoSelect: TRUE, // 键盘向上/下方向键时，是否自动选择值
    allowNoKeyword: TRUE, // 是否允许无关键字时请求数据
    getDataMethod: "firstByUrl", // 获取数据的方式，url：一直从url请求；data：从 options.data 获取；firstByUrl：第一次从Url获取全部数据，之后从options.data获取
    delayUntilKeyup: FALSE, // 获取数据的方式 为 firstByUrl 时，是否延迟到有输入时才请求数据
    ignorecase: FALSE, // 前端搜索匹配时，是否忽略大小写
    effectiveFields: [], // 有效显示于列表中的字段，非有效字段都会过滤，默认全部有效。
    effectiveFieldsAlias: {}, // 有效字段的别名对象，用于 header 的显示
    searchFields: [], // 有效搜索字段，从前端搜索过滤数据时使用，但不一定显示在列表中。effectiveFields 配置字段也会用于搜索过滤
    twoWayMatch: TRUE, // 是否双向匹配搜索。为 true 即输入关键字包含或包含于匹配字段均认为匹配成功，为 false 则输入关键字包含于匹配字段认为匹配成功
    multiWord: FALSE, // 以分隔符号分割的多关键字支持
    separator: ",", // 多关键字支持时的分隔符，默认为半角逗号
    delay: 300, // 搜索触发的延时时间间隔，单位毫秒
    emptyTip: "", // 查询为空时显示的内容，可为 html
    searchingTip: "搜索中...", // ajax 搜索时显示的提示内容，当搜索时间较长时给出正在搜索的提示
    hideOnSelect: FALSE, // 鼠标从列表单击选择了值时，是否隐藏选择列表
    maxOptionCount: 200, // 选择列表最多显示的可选项数量，默认为 200

    /* UI */
    autoDropup: FALSE, // 选择菜单是否自动判断向上展开。设为 true，则当下拉菜单高度超过窗体，且向上方向不会被窗体覆盖，则选择菜单向上弹出
    autoMinWidth: FALSE, // 是否自动最小宽度，设为 false 则最小宽度不小于输入框宽度
    showHeader: FALSE, // 是否显示选择列表的 header。为 true 时，有效字段大于一列则显示表头
    showBtn: TRUE, // 是否显示下拉按钮
    inputBgColor: "", // 输入框背景色，当与容器背景色不同时，可能需要该项的配置
    inputWarnColor: "rgba(255,0,0,.1)", // 输入框内容不是下拉列表选择时的警告色
    listStyle: {
      "padding-top": 0,
      "max-height": "375px",
      "max-width": "800px",
      overflow: "auto",
      width: "auto",
      transition: "0.3s",
      "-webkit-transition": "0.3s",
      "-moz-transition": "0.3s",
      "-o-transition": "0.3s",
      "word-break": "keep-all",
      "white-space": "nowrap"
    }, // 列表的样式控制
    listAlign: "left", // 提示列表对齐位置，left/right/auto
    listHoverStyle: "background: #07d; color:#fff", // 提示框列表鼠标悬浮的样式
    listHoverCSS: "jhover", // 提示框列表鼠标悬浮的样式名称
    clearable: FALSE, // 是否可清除已输入的内容

    /* key */
    keyLeft: 37, // 向左方向键，不同的操作系统可能会有差别，则自行定义
    keyUp: 38, // 向上方向键
    keyRight: 39, // 向右方向键
    keyDown: 40, // 向下方向键
    keyEnter: 13, // 回车键

    /* methods */
    fnProcessData: processData, // 格式化数据的方法，返回数据格式参考 data 参数
    fnGetData: getData, // 获取数据的方法，无特殊需求一般不作设置
    fnAdjustAjaxParam: null, // 调整 ajax 请求参数方法，用于更多的请求配置需求。如对请求关键字作进一步处理、修改超时时间等
    fnPreprocessKeyword: null, // 搜索过滤数据前，对输入关键字作进一步处理方法。注意，应返回字符串
    fnAjaxFail: null // ajax 失败时回调方法
  };

  var methods = {
    init: function(options) {
      // 参数设置
      var self = this;
      options = options || {};

      // 默认配置有效显示字段多于一个，则显示列表表头，否则不显示
      if (
        isUndefined(options.showHeader) &&
        options.effectiveFields &&
        options.effectiveFields.length > 1
      ) {
        options.showHeader = TRUE;
      }

      options = $.extend(TRUE, {}, defaultOptions, options);

      // 旧的方法兼容
      if (options.processData) {
        options.fnProcessData = options.processData;
      }

      if (options.getData) {
        options.fnGetData = options.getData;
      }

      if (
        options.getDataMethod === "firstByUrl" &&
        options.url &&
        !options.delayUntilKeyup
      ) {
        ajax(options).done(function(result) {
          options.url = null;
          self.trigger(onDataRequestSuccess, result);
        });
      }

      // 鼠标滑动到条目样式
      if (!$("#" + BSSUGGEST).length) {
        $("head:eq(0)").append(
          '<style id="' +
            BSSUGGEST +
            '">.' +
            options.listHoverCSS +
            "{" +
            options.listHoverStyle +
            "}</style>"
        );
      }

      return self.each(function() {
        var $input = $(this),
          $parent = $input.parent(),
          $iClear = getIClear($input, options),
          isMouseenterMenu,
          keyupTimer, // keyup 与 input 事件延时定时器
          $dropdownMenu = $parent.find("ul:eq(0)");

        // 兼容 bs4
        $dropdownMenu.parent().css("position", "relative");

        // 验证输入框对象是否符合条件
        if (!checkInput($input, $dropdownMenu, options)) {
          console.warn(
            "不是一个标准的 bootstrap 下拉式菜单或已初始化:",
            $input
          );
          return;
        }

        // 是否显示 button 按钮
        if (!options.showBtn) {
          $input.css("borderRadius", 4);
          $parent
            .css("width", "100%")
            .find(".btn:eq(0)")
            .hide();
        }

        // 移除 disabled 类，并禁用自动完成
        $input
          .removeClass(DISABLED)
          .prop(DISABLED, FALSE)
          .attr("autocomplete", "off");
        // dropdown-menu 增加修饰
        $dropdownMenu.css(options.listStyle);

        // 默认背景色
        if (!options.inputBgColor) {
          options.inputBgColor = $input.css("backgroundColor");
        }

        // 开始事件处理
        $input
          .on("keydown.bs", function(event) {
            var currentList, tipsKeyword; // 提示列表上被选中的关键字

            // 当提示层显示时才对键盘事件处理
            if (!$dropdownMenu.is(":visible")) {
              setOrGetDataId($input, "");
              return;
            }

            currentList = $dropdownMenu.find("." + options.listHoverCSS);
            tipsKeyword = ""; // 提示列表上被选中的关键字

            unHoverAll($dropdownMenu, options);

            if (event.keyCode === options.keyDown) {
              // 如果按的是向下方向键
              if (!currentList.length) {
                // 如果提示列表没有一个被选中,则将列表第一个选中
                tipsKeyword = getPointKeyword(
                  $dropdownMenu.find("tbody tr:first").mouseover()
                );
              } else if (!currentList.next().length) {
                // 如果是最后一个被选中,则取消选中,即可认为是输入框被选中，并恢复输入的值
                if (options.autoSelect) {
                  setOrGetDataId($input, "").val(setOrGetAlt($input));
                }
              } else {
                // 选中下一行
                tipsKeyword = getPointKeyword(currentList.next().mouseover());
              }
              // 控制滑动条
              adjustScroll($input, $dropdownMenu, options);

              if (!options.autoSelect) {
                return;
              }
            } else if (event.keyCode === options.keyUp) {
              // 如果按的是向上方向键
              if (!currentList.length) {
                tipsKeyword = getPointKeyword(
                  $dropdownMenu.find("tbody tr:last").mouseover()
                );
              } else if (!currentList.prev().length) {
                if (options.autoSelect) {
                  setOrGetDataId($input, "").val(setOrGetAlt($input));
                }
              } else {
                // 选中前一行
                tipsKeyword = getPointKeyword(currentList.prev().mouseover());
              }

              // 控制滑动条
              adjustScroll($input, $dropdownMenu, options);

              if (!options.autoSelect) {
                return;
              }
            } else if (event.keyCode === options.keyEnter) {
              tipsKeyword = getPointKeyword(currentList);
              hideDropMenu($input, options);
            } else {
              setOrGetDataId($input, "");
            }

            // 设置值 tipsKeyword
            // console.log(tipsKeyword);
            setValue($input, tipsKeyword, options);
          })
          .on("compositionstart.bs", function(event) {
            // 中文输入开始，锁定
            // console.log('compositionstart');
            inputLock = TRUE;
          })
          .on("compositionend.bs", function(event) {
            // 中文输入结束，解除锁定
            // console.log('compositionend');
            inputLock = FALSE;
          })
          .on("keyup.bs input.bs paste.bs", function(event) {
            var word;

            if (event.keyCode) {
              setBackground($input, options);
            }

            // 如果弹起的键是回车、向上或向下方向键则返回
            if (
              ~$.inArray(event.keyCode, [
                options.keyDown,
                options.keyUp,
                options.keyEnter
              ])
            ) {
              $input.val($input.val()); // 让鼠标输入跳到最后
              return;
            }

            clearTimeout(keyupTimer);
            keyupTimer = setTimeout(function() {
              // console.log('input keyup', event);

              // 锁定状态，返回
              if (inputLock) {
                return;
              }

              word = $input.val();

              // 若输入框值没有改变则返回
              if ($.trim(word) && word === setOrGetAlt($input)) {
                return;
              }

              // 当按下键之前记录输入框值,以方便查看键弹起时值有没有变
              setOrGetAlt($input, word);

              if (options.multiWord) {
                word = word.split(options.separator).reverse()[0];
              }

              // 是否允许空数据查询
              if (!word.length && !options.allowNoKeyword) {
                return;
              }

              options.fnGetData($.trim(word), $input, refreshDropMenu, options);
            }, options.delay || 300);
          })
          .on("focus.bs", function() {
            // console.log('input focus');
            adjustDropMenuPos($input, $dropdownMenu, options);
          })
          .on("blur.bs", function() {
            if (!isMouseenterMenu) {
              // 不是进入下拉列表状态，则隐藏列表
              hideDropMenu($input, options);
              inputLock = true;
              setTimeout(function() {
                inputLock = FALSE;
              });
            }
          })
          .on("click.bs", function() {
            // console.log('input click');
            var word = $input.val();

            if (
              $.trim(word) &&
              word === setOrGetAlt($input) &&
              $dropdownMenu.find("table tr").length
            ) {
              return showDropMenu($input, options);
            }

            if ($dropdownMenu.is(":visible")) {
              return;
            }

            if (options.multiWord) {
              word = word.split(options.separator).reverse()[0];
            }

            // 是否允许空数据查询
            if (!word.length && !options.allowNoKeyword) {
              return;
            }

            // console.log('word', word);
            options.fnGetData($.trim(word), $input, refreshDropMenu, options);
          });

        // 下拉按钮点击时
        $parent
          .find(".btn:eq(0)")
          .attr("data-toggle", "")
          .click(function() {
            if (!$dropdownMenu.is(":visible")) {
              if (options.url) {
                $input.click().focus();
                if (!$dropdownMenu.find("tr").length) {
                  return FALSE;
                }
              } else {
                // 不以 keyword 作为过滤，展示所有的数据
                refreshDropMenu($input, options.data, options);
              }
              showDropMenu($input, options);
            } else {
              hideDropMenu($input, options);
            }

            return FALSE;
          });

        // 列表中滑动时，输入框失去焦点
        $dropdownMenu
          .mouseenter(function() {
            // console.log('mouseenter')
            isMouseenterMenu = 1;
            $input.blur();
          })
          .mouseleave(function() {
            // console.log('mouseleave')
            isMouseenterMenu = 0;
            $input.focus();
          })
          .on("mouseenter", "tbody tr", function() {
            // 行上的移动事件
            unHoverAll($dropdownMenu, options);
            $(this).addClass(options.listHoverCSS);

            return FALSE; // 阻止冒泡
          })
          .on("mousedown", "tbody tr", function() {
            var keywords = getPointKeyword($(this));
            setValue($input, keywords, options);
            setOrGetAlt($input, keywords.key);
            setBackground($input, options);

            if (options.hideOnSelect) {
              hideDropMenu($input, options);
            }
          });

        // 存在清空按钮
        if ($iClear.length) {
          $iClear.click(function() {
            setOrGetDataId($input, "").val("");
            setBackground($input, options);
          });

          $parent
            .mouseenter(function() {
              if (!$input.prop(DISABLED)) {
                $iClear
                  .css(
                    "right",
                    options.showBtn
                      ? Math.max($input.next().width(), 33) + 2
                      : 12
                  )
                  .show();
              }
            })
            .mouseleave(function() {
              $iClear.hide();
            });
        }
      });
    },
    show: function() {
      return this.each(function() {
        $(this).click();
      });
    },
    hide: function() {
      return this.each(function() {
        hideDropMenu($(this));
      });
    },
    disable: function() {
      return this.each(function() {
        $(this)
          .attr(DISABLED, TRUE)
          .parent()
          .find(".btn:eq(0)")
          .prop(DISABLED, TRUE);
      });
    },
    enable: function() {
      return this.each(function() {
        $(this)
          .attr(DISABLED, FALSE)
          .parent()
          .find(".btn:eq(0)")
          .prop(DISABLED, FALSE);
      });
    },
    destroy: function() {
      return this.each(function() {
        var evNameList =
          "click.bs keydown.bs compositionstart.bs compositionend.bs keyup.bs input.bs paste.bs focus.bs click.bs";
        $(this)
          .off(evNameList)
          .removeData(BSSUGGEST)
          .removeAttr("style")
          .parent()
          .find(".btn:eq(0)")
          .off()
          .show()
          .attr("data-toggle", "dropdown")
          .prop(DISABLED, FALSE) // .addClass(DISABLED);
          .next()
          .css("display", "")
          .off();
      });
    },
    version: function() {
      return VERSION;
    }
  };

  $.fn[BSSUGGEST] = function(options) {
    // 方法判断
    if (typeof options === "string" && methods[options]) {
      var inited = TRUE;
      this.each(function() {
        if (!$(this).data(BSSUGGEST)) {
          return (inited = FALSE);
        }
      });
      // 只要有一个未初始化，则全部都不执行方法，除非是 init 或 version
      if (!inited && "init" !== options && "version" !== options) {
        return this;
      }

      // 如果是方法，则参数第一个为函数名，从第二个开始为函数参数
      return methods[options].apply(this, [].slice.call(arguments, 1));
    } else {
      // 调用初始化方法
      return methods.init.apply(this, arguments);
    }
  };
});