如何在kendo菜单中检索id值

时间:2012-08-24 10:14:22

标签: javascript asp.net-mvc kendo-ui

我在我的项目中使用了kendo菜单。我想在点击所选项目时检索id值。我使用onSelect事件,我能够检索所选项目Text.can你告诉我如何检索id值

2 个答案:

答案 0 :(得分:6)

您可以使用HTML5数据属性来完成此任务。

<强> HTML

<div id="example" class="k-content">
    <ul id="menu">
        <li>
            First Item
            <ul>
                <li data-id="12345">Sub Item 1 with ID</li>
                <li>Sub Item 2</li>
                <li>Sub Item 3</li>
                <li>Sub Item 4</li>
            </ul>
        </li>
        <li>
            Second Item
            <ul>
                <li>Sub Item 1</li>
                <li>Sub Item 2</li>
                <li>Sub Item 3</li>
                <li>Sub Item 4</li>
            </ul>
        </li>
        <li>
            Third Item
            <ul>
                <li>Sub Item 1</li>
                <li>Sub Item 2</li>
                <li>Sub Item 3</li>
                <li>Sub Item 4</li>
            </ul>
        </li>
        <li>
            Fourth Item
            <ul>
                <li>Sub Item 1</li>
                <li>Sub Item 2</li>
                <li>Sub Item 3</li>
                <li>Sub Item 4</li>
            </ul>
        </li>
        <li>
            Fifth Item
            <ul>
                <li>Sub Item 1</li>
                <li>Sub Item 2</li>
                <li>Sub Item 3</li>
                <li>Sub Item 4</li>
            </ul>
        </li>
    </ul>
</div>

和Javascript:

        <script>
            $(document).ready(function() {


                function onSelect(e) {
                    var id = $(e.item).attr('data-id');
                }

                $("#menu").kendoMenu({
                    select: onSelect               
                });
            });
        </script>

答案 1 :(得分:4)

您可以在初始化它的UL / LI结构中设置ID(查看Robotsushi的答案)。但是,如果您想要动态初始化菜单,可以使用类似这样的内容 - http://jsfiddle.net/MMRCf/8/