如何在剑道菜单中以编程方式选择菜单项

Question

我有一个包含值的菜单，我想添加一个键快捷方式来选择该项。

我可以在这把小提琴上展示我正在寻找的

function onSelect(e) {
    var item = $(e.item),
        menuElement = item.closest(".k-menu"),
        dataItem = this.options.dataSource,
        index = item.parentsUntil(menuElement, ".k-item").map(function () {
            return $(this).index();
        }).get().reverse();
    index.push(item.index());
    for (var i = -1, len = index.length; ++i < len;) {
        dataItem = dataItem[index[i]];
        dataItem = i < len-1 ? dataItem.items : dataItem;
    }
    alert(dataItem.value);
}
$(document).ready(function() {
    $("#menu").kendoMenu({
        dataSource: [
            {
                text: "Item 1 (A)",
                value: "A",
                items: [
                    {
                        text: "Sub Item 1 (L)",
                        value: "L",
                        items: [
                            {
                                text: "Sub Sub Item 1 (D)",
                                value: "D"
                            },
                            {
                                text: "Sub Sub Item 2 (E)",
                                 value: "E"
                            }
                         ]
                    },
                    {
                        text: "Sub Item 2 (O)",
                        value: "O"
                    }
                ]
            },
            {
                text: "Item 2 (F)",
                value: "F"
            },
            {
                text: "Item 3 (G)",
                value: "G"
            }
        ],
        select: onSelect
    });
    $(document.body).keydown(function (e) {
            var menu = $("#menu").kendoMenu().data("kendoMenu");
            if (e.altKey && e.keyCode == 76) {
                alert("select item with value L");
                // Pseudocode:
                // var item = find item with value L
                // menu.select(item); (or trigger)
            }
        }); 
});

我在任何地方都找不到任何可以做到这一点的资源。此外，我无法通过数据源将id分配给渲染的"li"，这使得很难选择菜单的节点。

有什么想法吗？

Answer 1

不确定Kendo API是否支持触发选择项，但我可以使用JQuery实现用键盘快捷键点击菜单项。

检查此JSFiddle

function clickMenuSpan(keyCode){
    var shortcut = String.fromCharCode(keyCode);
    $('#menu span.k-link').each(function(){
        var txt = $(this).text();
        if(txt.substr(-3) === '(' + shortcut + ')')
        {
            $(this).click();
        }
    })
}

您可以在您的keydown事件中使用上述功能。并添加一些筛选器，仅对快捷方式数组调用此筛选器。

 $(document.body).keydown(function (e) {
        var menu = $("#menu").kendoMenu().data("kendoMenu");
        if (e.altKey) {
            clickMenuSpan(e.keyCode);
        }
    });