如何在 select2 选项上启用悬停事件答案

【问题标题】：How do enable hover event on select2 choice如何在 select2 选项上启用悬停事件
【发布时间】：2013-11-25 07:37:19
【问题描述】：

我正在使用 select2。内置事件不支持所选项目上的悬停事件，因此我试图在鼠标悬停在项目上时触发悬停事件（多选）。

function tagFormat(state) {
    return '<span class="tagElement">' + state.text + '</span>';
}
$('.tagElement').hover(function(event){
    alert('something');
});
var sampleTags = ['red','white'];
$("[taggable]").select2({
    formatSelection: tagFormat,
    maximumInputLength: 10,
    tags:sampleTags,
    tokenSeparators: [",", " "]
});

Bootply at http://bootply.com/96527 ，您可以看到在 select2 外部，悬停事件确实会触发，但在 select2 内部却不会。里面的机制是什么？

【问题讨论】：

标签： jquery tags

【解决方案1】：

select2.js 有一个函数，.show，当你将鼠标悬停在一个选项上时，它会更新属性“aria- describeby”。这个功能可以扩展...

jsfiddle example

c.prototype.show = function() {
    var b = a.Event("show.bs." + this.type);
    this.$element.trigger(b);
    var d = a.contains(this.$element[0].ownerDocument.documentElement, this.$element[0]);
    if (b.isDefaultPrevented() || !d) return;
    var e = this,
        f = this.tip(),
        g = this.getUID(this.type);
    /*look for the select box and find the 'onmouseover' attribute */
    var s = this.$element.siblings('select');

    if (s != undefined && s.attr('onmouseover') != undefined) {
        var m = s.attr('onmouseover');
        eval(m);
   }
   ...
}

【讨论】：