我使用Select2 3.3.2

我有很长的选择在选择。
例:

<select id="e1">
<option value="AL">Alabama</option>
<option value="WY">Wyoming</option>
<option value="WY">very long long long text</option>
<option value="WY">very long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long text</option>
</select>

目的是避免在下拉菜单打开时包装选项。

我想为下拉菜单设置长宽度(例如 – 800px,甚至自动评估宽度)。

但是当下拉菜单关闭时(例如300px),保持输入宽度较小。

我跟着这个“Add option to set dropdown width”的select2。

但我不能让它工作,选项/下拉菜单的宽度是相同的输入的宽度和选项包装到多行。

这里是我的问题在jsfiddle – http://jsfiddle.net/ewwAX/的演示

谢谢大家提前帮忙。

解决方法

您使用的属性不是用于控制下拉宽度。您可以使用dropdownCssClass属性。

Here’s a demo in jsFiddle

JavaScript:

$(document).ready(function() { 
    $("#e1").select2({dropdownCssClass : 'bigdrop'}); 
});

CSS:

.bigdrop {
    width: 600px !important;
}

jquery – select2 – 为输入和下拉菜单设置不同的宽度的更多相关文章

  1. HTML5单选框、复选框、下拉菜单、文本域的实现代码

    这篇文章主要介绍了HTML5单选框、复选框、下拉菜单、文本域的实现代码,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  2. Swift下拉菜单动画实现

    本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容,请发送邮件至dio@foxmail.com举报,一经查实,本站将立刻删除。

  3. 使用视图控制器的切换创建下拉菜单栏

    下拉菜单则是另一种常用的菜单设计。当用户点击菜单按键的是时候主屏幕中下拉显示出菜单选项。如果你不知道下拉菜单是如何实现的话,不需要忧虑。在展示下拉菜单的实现之前,这篇文章已经假设你对自定义视图切换有一定的了解。下拉菜单功能的开始演示在这篇教程中我们会用Swift语言来实现下拉菜单,下面就是最终效果的一个快速展示:工程模版和以往一样,我不希望你从头开始,你可以先去下载起始工程。

  4. Swift 类似美团下拉菜单

    本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容,请发送邮件至dio@foxmail.com举报,一经查实,本站将立刻删除。

  5. android – 如何在Evernote应用程序中制作这样的下拉菜单?

    单击操作栏中的中间图标时,会出现一个下拉菜单:我如何制作其中一个?

  6. android – WebView / Phonegap更改选择(下拉菜单)样式

    本机选择如下所示:解决方法没有办法实现这一点.您需要做的是构建一个本机插件,当您点击时才会打开一个自定义对话框.您要摆脱的下拉菜单是用于在网络浏览上选择的默认视图,而与Chrome中内置的第二个相反.帮助您开始://获取所有选项并存储在数组中//本机函数获取选项并显示一个对话框确保将您的主题设置为Holo或Holo.Light,您可以选择,并且只要点击select元素,就可以从javascript层调用本机代码.

  7. vue实现下拉菜单效果

    这篇文章主要为大家详细介绍了vue实现下拉菜单效果,运用了hover显示与隐藏以及定位,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  8. JavaScript实现网页下拉菜单效果

    这篇文章主要为大家详细介绍了JavaScript实现网页下拉菜单效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  9. react实现移动端下拉菜单的示例代码

    这篇文章主要介绍了react实现移动端下拉菜单的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

  10. 更换select下拉菜单背景样式的实现代码

    更换select下拉菜单背景样式的实现代码,需要的朋友可以参考下。

随机推荐

  1. jquery-plugins – 是否可以使用猫头鹰旋转木马实现循环/无限轮播?

    我正在使用猫头鹰旋转木马,它的工作完美,除了它不支持循环/无限滚动.我没有搜索google和stackoverflow的想法,没有运气.有没有人在猫头鹰旋转木马上实现圆形/无限滚动?

  2. jQuery动态输入字段焦点

    我想使用以下jQuery向我的页面动态添加一个输入字段:在这样做之后,我希望输入字段具有闪烁的文本光标的焦点,所以我想在创建后立即输入.有人可以告诉我我该怎么办?

  3. jquery – 为什么$(window).height()这样错了?

    我试图获取当前浏览器的视口高度,使用但我得到的价值观太低了.当视口高度高达850px时,我从height()获取大约350或400像素的值.这是怎么回事?

  4. jquery – 如果在此div之外和其他draggables内部(使用无效和有效的还原选项),则可拖动恢复

    例如这样但是由于明显的原因,这不行.我可以说这个吗?

  5. 创建一个jQueryUI 1.8按钮菜单

    现在jQueryUI1.8已经出来了,我正在浏览更新,并且遇到了新的Buttonwidget,特别是SplitButtonwithadropdown的演示之一.这个演示似乎表明Buttonwidget可以在这里创建一个下拉菜单.作为讨论的问题,我想知道使用这个新的Button小部件来创建一个下拉菜单有什么方法.干杯.解决方法您必须在按钮下方列出一个列表,方式类似于此处为自动完成提供的演示:http

  6. 灰色divs使用JQuery

    我试图使用这个代码:为了淡出一大堆名为MySelectorDiv的div,唯一的是,它只会淡出第一个而不是所有的div,为什么呢?

  7. 使用jQuery动态插入到列表中

    我有两个订单列表在彼此旁边.当我从一个列表中选出一个节点时,我想按照字母顺序插入到另一个列表中.抓住的是我想要把一个元素放在另一个列表中,而不刷新整个列表.奇怪的是,当我插入到右边的列表中,它工作正常,但是当我插入到左边的列表中时,顺序永远不会出来.我也尝试将所有内容读入数组,并将其排序在一起,以防止children()方法没有按照显示顺序返回任何东西,但是我仍然得到相同的结果.这是我的jQuer

  8. 没有回应MediaWiki API使用jQuery

    我试图从维基百科获取一些内容作为JSON:但我没有回应.如果我粘贴到浏览器的地址栏,就像我得到预期的内容.怎么了?解决方法您需要通过添加&callback=?来触发具有$.getJSON()的JSONP行为?在querystring上,像这样:Youcantestithere.没有使用JSONP,你正在击中same-originpolicy,阻止XmlHttpRequest获取任何数据.

  9. jQuery Ajax请求每30秒

    我有这段代码,但是有些人在我的网站上的值可能会改变.我需要每30秒钟更新一次#financediv.这可以做吗解决方法您可以将代码放在单独的函数中,如下所示:然后每30秒建立一个定时器调用该函数:祝你好运!总结以上是DEVMAX为你收集整理的jQueryAjax请求每30秒全部内容。如果觉得DEVMAX网站内容还不错,欢迎将DEVMAX网站推荐给好友。

  10. jquery – keypress事件在IE和Chrome中不工作,但在FF工作

    任何想法为什么会这样发生?我通常认为Chrome会更加宽容代码?这是我的按键键.我错过了什么吗?右图();和leftimage();是应该工作的功能,因为我在其他地方使用这些功能谢谢您的帮助!

返回
顶部