.hover用于select2中的下拉元素(结果)

时间:2017-11-24 14:24:39

标签: jquery twitter-bootstrap jquery-select2

是否可以触发事件或从select2向结果元素添加类?

我的意思是可以添加带containerCssClass dropdownCssClass的类,这些类提供了向给定元素添加类的功能。但是我想在结果项中添加至少一个类。为了澄清,这些是下拉元素中的元素。

最后用法是为突出显示的元素设置.hover。通过将鼠标悬停在它上面,在用户单击它以选择它之前,将会在单独的div中显示有关突出显示元素的更多信息。这是因为一些结果具有相同的基本数据,而详细数据不同。在结果中添加它会使它的宽度太大并使它看起来很混乱,所以最干净的解决方案将是一个单独的div。

理想情况下,如果鼠标悬停在结果元素上至少0.5秒,我会想要更改div。这是由于发生了ajax调用。

我正在使用select2 3.5.2。

编辑: 对于我在bootstrap中的意思,而不是zf2。

1 个答案:

答案 0 :(得分:0)

经过大量挖掘select2.js和许多指导方针后,我选择了 formatResult 。没有明确的文档(至少我找不到),但它基本上做的是它允许用户将其他数据存储到结果中。这些通常是" li"中的纯文本。使用此功能可以修改其中的内容。

通过解决我的特定情况,我插入了带有onmouseover和onmouseleave事件的span,其中包含自定义id和属性。

onmouseover触发一个函数,该函数创建一个超时为1秒的函数。在1秒之后,div将使用先前创建的范围中的属性进行更新。

onmouseleave将超时函数设置为null,这意味着div不会在包含额外数据的所有内容中得到更新。

希望这个解决方案可以节省大量时间。

此解决方案不需要在select2库中进行修改。