我有一个select2下拉列表,如下所示:
$(function () {
$("#itemSelect").select2().on("select2:select", function (e) {
$("#itemSelect").val(-1).trigger("change");
var id = e.params.data.title;
var url = siteRoot + "/site/item?itemID=" + id ;
$("#Container").load(url);
});
});
它从我的模型中获取它的值:
<select class="js-data-example-ajax" aria-expanded="true" style="width: 100%; display: none;" id="itemSelect">
<option disabled selected value="-1"> Search by item </option>
@foreach (var item in Model)
{
<option text="@item.Id" title="@item.Id">
item.Name
</option>
}
一切正常,除了当我选择一个项目并加载它时,我可以将鼠标悬停在下拉列表上,它会显示项目中的ID . 我不想出示身份证!
在图片中,您可以看到当我将鼠标悬停在“冰茶”上时显示的下拉列表和项目编号
我知道这是因为select2通过 var id = e.params.data.title;
得到了id,但我怎么能改变这个呢?它不适用 var id = e.params.data.id;
我尝试使用工具提示,但我是新手 .
//$("#select2-itemSelect-container").tooltip({
// title: "Search item",
// placement: "auto"
//});
我只是想在鼠标悬停时删除下拉列表中的ID . 感谢每一位帮助 .
5 回答
您可以在select2脚本中简单地注释这几行
这不会在第一个位置添加title属性
尝试禁用创建的select2的工具提示 .
通过将鼠标放在选择框(单选模式)或选定标签上(在多选模式下),可以在 Select2 v4 中重现该问题:
默认情况下,插件会将
title
属性附加到这些元素,并且没有可用于禁用此行为的配置选项 .我最终为
Select2
插件编写了一个小扩展 . 我添加了一个新选项selectionTitleAttribute
,必须将其设置为false才能删除title
属性 .在插件的js文件后面添加以下代码:
用法
将
selectionTitleAttribute
选项设置为false
初始化select2插件:演示
小提琴:http://jsfiddle.net/hr8bqnpn/
我可能有点晚了,但是因为我动态地将select2字段添加到UI,所以这个解决方案不适用于我 .
这段代码对我有用:
如果您还动态添加select2字段,请不要忘记始终在上面的代码之前执行此代码:
此代码将首先删除所有select2字段上的
on hover
listener .您可以使用事件删除 Headers 标记 .
例如,此代码适用于select2 v4.0:
http://jsfiddle.net/by8k1dv9/