Kendo DropDownList 工具提示聚焦
Kendo DropDownList Tooltip on focus
有什么方法可以在 focus 上的 Kendo DropDownList 上显示工具提示吗?悬停有效,单击有效但不关注。我想对 DropDownList 实施 Bootstrap 弹出窗口,但似乎 Kendo 工具提示也不起作用。
<input id="myInput" class="k-group" />
$("#myInput").kendoDropDownList({}).data("kendoDropDownList").wrapper.find(".k-input").kendoTooltip({
content: 'tooltip tooltip tooltip',
showOn: 'focus' // DOESN'T WORK
//showOn: 'mouseenter' // Works fine
//showOn: 'click' // Works fine
});
https://codepen.io/raptor/pen/ZXzOwQ
编辑:
我想知道,为什么焦点方法不起作用。 DropDownList 是否不受支持?
手动显示:
var e = $("#myInput")
.kendoDropDownList({})
.data("kendoDropDownList")
.wrapper
.find(".k-input")
.kendoTooltip({
content: 'tooltip tooltip tooltip',
showOn: 'mouseenter click'
});
e.closest(".k-widget").on("focus", function() {
$(this).find(".k-input").data("kendoTooltip").show();
});
更新:
更好的是,在 wrapper
而不是 .k-input
中创建工具提示:
$("#myInput")
.kendoDropDownList({})
.data("kendoDropDownList")
.wrapper
.kendoTooltip({
content: 'tooltip tooltip tooltip',
showOn: 'mouseenter click focus'
});
有什么方法可以在 focus 上的 Kendo DropDownList 上显示工具提示吗?悬停有效,单击有效但不关注。我想对 DropDownList 实施 Bootstrap 弹出窗口,但似乎 Kendo 工具提示也不起作用。
<input id="myInput" class="k-group" />
$("#myInput").kendoDropDownList({}).data("kendoDropDownList").wrapper.find(".k-input").kendoTooltip({
content: 'tooltip tooltip tooltip',
showOn: 'focus' // DOESN'T WORK
//showOn: 'mouseenter' // Works fine
//showOn: 'click' // Works fine
});
https://codepen.io/raptor/pen/ZXzOwQ
编辑: 我想知道,为什么焦点方法不起作用。 DropDownList 是否不受支持?
手动显示:
var e = $("#myInput")
.kendoDropDownList({})
.data("kendoDropDownList")
.wrapper
.find(".k-input")
.kendoTooltip({
content: 'tooltip tooltip tooltip',
showOn: 'mouseenter click'
});
e.closest(".k-widget").on("focus", function() {
$(this).find(".k-input").data("kendoTooltip").show();
});
更新:
更好的是,在 wrapper
而不是 .k-input
中创建工具提示:
$("#myInput")
.kendoDropDownList({})
.data("kendoDropDownList")
.wrapper
.kendoTooltip({
content: 'tooltip tooltip tooltip',
showOn: 'mouseenter click focus'
});