Kendo ui 剑道工具提示仅在第二个'；悬停'；事件

我使用剑道网格，希望在标题单元格中显示图标的剑道工具提示。 我有以下代码：

                <div id="grid"></div>

                <script>
                    $(document).ready(function () {
                        var grid = $("#grid").kendoGrid({
                            dataSource: {
                                type: "json",
                                transport: {
                                    read: {
                                        url: "@Html.Raw(Url.Action("List", "i3screenResult"))",
                                        type: "POST",
                                        dataType: "json",
                                        data: function () {
                                            var data = {
                                            };
                                            addAntiForgeryToken(data);
                                            return data;
                                        }
                                    }
                                },
                                schema: {
                                    data: "Data",
                                    total: "Total",
                                    errors: "Errors"
                                },
                            },
                            dataBinding: function (e) {
                                $('.questionmark').on("hover", function () {
                                    var tooltip = $(this).kendoTooltip({
                                        content: $(this).attr('tooltip'),
                                        width: 120,
                                        position: "top",
                                        animation: {
                                            open: {
                                                effects: "zoom",
                                                duration: 150
                                            }
                                        }
                                    }).data("kendoTooltip");
                                });
                            },
                            scrollable: false,
                            columns: [
                                {
                                    field: "BackgroundReportAccount",
                                    headerTemplate: "@T("DrugConsortium.i3screen.Fields.BackgroundReportAccount") <img src='/images/question-mark-icon.png' class='questionmark' tooltip='@T("DrugConsortium.i3screen.Fields.BackgroundReportAccount.Details")' />",
                                    width: 150
                                },
                                {
                                    field: "ProviderReferenceId",
                                    headerTemplate: "@T("DrugConsortium.i3screen.Fields.ProviderReferenceId") <img src='/images/question-mark-icon.png' class='questionmark' tooltip='@T("DrugConsortium.i3screen.Fields.ProviderReferenceId.Details")' />",
                                    width: 150
                                },
                                //....
                            ]
                        });
                    });
                </script>

$（文档）.ready（函数（）{
var grid=$（“#grid”）.kendoGrid({
数据源：{
键入：“json”，
运输：{
阅读：{
url:“@Html.Raw（url.Action（“列表”、“i3screenResult”）”，
类型：“POST”，
数据类型：“json”，
数据：函数（）{
风险值数据={
};
addAntiForgeryToken（数据）；
返回数据；
}
}
},
模式：{
数据：“数据”，
总计：“总计”，
错误：“错误”
},
},
数据绑定：函数（e）{
$（'.questionmark'）。打开（“悬停”，函数（）{
var tooltip=$（this）.kendoTooltip({
内容：$（this.attr（'tooltip'），
宽度：120，
位置：“顶部”，
动画：{
开放式：{
效果：“缩放”，
持续时间：150
}
}
}).数据（“kendoTooltip”）；
});
},
可滚动：false，
栏目：[
{
字段：“BackgroundReportAccount”，
headerTemplate:@T（“DrugConsortium.i3screen.Fields.BackgroundReportAccount”），
宽度：150
},
{
字段：“ProviderReferenceId”，
headerTemplate:“@T（“DrugConsortium.i3screen.Fields.ProviderReferenceId”）”，
宽度：150
},
//....
]
});
});

它可以工作，但仅在img的第二次悬停事件之后。

---

为什么会这样以及如何修复？

在网格初始化后尝试以下操作：

$('#grid').kendoTooltip({
    content: function(e) { 
        return $(e.target).attr('tooltip');
    },
    filter: 'img.questionmark', 
    width: 120,
    position: "top",
    animation: {
        open: {
            effects: "zoom",
            duration: 150
        }
    }
});

此外，您应该将属性名称从

tooltip

更改为

data tooltip

，因为

tooltip

不是标准的HTML属性。然后您可以使用

$（e.target）.data（'tooltip'）获得它的值

在网格初始化后尝试以下操作：

$('#grid').kendoTooltip({
    content: function(e) { 
        return $(e.target).attr('tooltip');
    },
    filter: 'img.questionmark', 
    width: 120,
    position: "top",
    animation: {
        open: {
            effects: "zoom",
            duration: 150
        }
    }
});

此外，您应该将属性名称从
tooltip
更改为
data tooltip
，因为
tooltip
不是标准的HTML属性。然后您可以使用
$（e.target）.data（'tooltip'）获得它的值

尝试在事件外部初始化工具提示，并在数据绑定时仅触发打开的工具提示。使用方法show tooltip.show（$（“#目标”）；尝试在事件外部初始化工具提示，并在数据绑定时仅触发打开的工具提示。使用方法show tooltip.show（$（“#目标”）@OlegSh，但它应该像中一样工作。请仔细检查您的代码。@OlegSh但它应该与中的一样工作。请仔细检查你的密码。