select2的dropdown错误

最新推荐文章于 2025-10-08 02:21:34 发布

原创最新推荐文章于 2025-10-08 02:21:34 发布 · 1.7k 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍了在使用Select2插件时遇到的样式错位问题及其解决方法。问题源于Select2元素的一个特定CSS属性导致元素重叠错位。通过设置正确的主题解决了样式问题。

今天在使用select2的时候生成的dropdown总是错误,遮住前面的内容.纠结了好久.发现生成的select2元素有一个class.select2-container--bootstrap有一个css属性为display:block导致了元素重叠错位.但是在select2.js里并没有发现这个类名.看了一会源码后发现有select2-container--"theme".在本例中并没有指定theme,一般应该默认default的,不知怎么就变成Bootstrap了.变成bootstrap之后,对应的css起作用,结果就样式变形了.在select2初始化时,设置theme为default就解决了.

在看js的过程中了解的方法:

$.fn.xx() 就是把自定义方法加到jquery中,之后就可以通过 $(..).xx()来调用了.
$.fx 指jquery特效,如使用显示、滑动、淡入淡出、动画等.$.fx.off可以关闭动画，其实是直接显示结果.
jQuery为开发插件提拱了两个方法，分别是： 
jQuery.fn.extend(object); 
jQuery.extend(object); 
jQuery.extend(object); 为扩展jQuery类本身.为类添加新的方法。 
jQuery.fn.extend(object);给jQuery对象添加方法。 

fn 是什么东西呢。查看jQuery代码，就不难发现。 
jQuery.fn = jQuery.prototype = { 
　　　init: function( selector, context ) {//....　 
　　　//...... 
}; 
参考:http://www.jb51.net/article/42750.htm
js平时使用的不深入,对很多东西了解比较少,平时需要注意积累.