jquery插件select2使用过程中遇到的问题

最新推荐文章于 2022-08-30 10:12:54 发布

木辰風

最新推荐文章于 2022-08-30 10:12:54 发布

阅读量854

点赞数

分类专栏：插件学习文章标签： javascript

本文链接：https://blog.csdn.net/qq_42277412/article/details/110133146

版权

插件学习专栏收录该内容

12 篇文章 1 订阅

订阅专栏

字段提示显示不完整

实际上，应该是这样的

原因：原本这个模块是隐藏的，初始化时this.$selection.find('.select2-selection__rendered').innerWidth()的长度为0，致使隐藏部分字段；重置选择框内容时，同时也会重置输入框的长度（调用Search.prototype.resizeSearch()方法）。

解决：

升级select2的版本，（我的版本是4.0.6-rc.0），升级到4.1.*；
修改插件select2.min.js；

  Search.prototype.resizeSearch = function () {
    this.$search.css('width', '25px');

    var width = '';

    if (this.$search.attr('placeholder') !== '') {
      width = this.$selection.find('.select2-selection__rendered').innerWidth();
    } else {
      var minimumWidth = this.$search.val().length + 1;

      width = (minimumWidth * 0.75) + 'em';
    }

    this.$search.css('width', width);
  };

修改为

 Search.prototype.resizeSearch = function () {
    this.$search.css('width', '25px');

    var width = '100%';

    if (this.$search.attr('placeholder') === '') {
      var minimumWidth = this.$search.val().length + 1;

      width = (minimumWidth * 0.75) + 'em';
    }

    this.$search.css('width', width);
  };