0

经过大量测试后，我发现我的菜单不再有效，因为 kendo ui 菜单组件中似乎存在错误。这曾经有效，现在不再有效。由于我们仍处于项目的早期阶段，我们没有太多使用导航，所以我不知道它什么时候停止工作。

我创建了一个非常简单的小提琴来演示这个问题。基本上有两个相邻的导航，一个有效，另一个无效。唯一的区别是，不起作用的那个有 openOnClick: true 和 closeOnClick: false。

注意：我必须将其设置为在小提琴的新窗口中打开链接，因为 jsfiddle 不会让谷歌在 iframe 中加载，所以允许弹出窗口。

小提琴：http: //jsfiddle.net/codeowl/HLaRx/4/

HTML：

<div style="padding:20px">
    <table style="width:500px">
        <tr>
            <td>Nav 1 Active Links DON'T Work:</td>
            <td>Nav 2 Active Links DO Work</td>
        </tr>
        <tr>
            <td><ul id="nav1" /></td>
            <td><ul id="nav2" /></td>
        </tr>
    </table>
</div>

JavaScript：

$(document).ready(function() {
    var oNav1 = null,
        oNav2 = null,
        oNavData = [{
            "text": "Administration",
            "encoded": true,
            "content": "<div class=\"ma-hpm-dropPanel\"><table><tr><td><div class=\"ma-hpm-cellPadding\"><span class=\"ma-hpm-menuPanelGroupHeader\">Application Administration</span><ul><li><span class='ma-hpm-dissabledPanelLink'>Dissabled Link</span></li><li><a target='_blank' class='ma-hpm-panelLink' href='http://www.google.com.au'>Active Link</a></li></ul></div></td></tr></table></div>"
        }];

    oNav2 = $('#nav1').kendoMenu({
        openOnClick: true,
        closeOnClick: false
    }).data('kendoMenu');

    oNav1 = $('#nav2').kendoMenu().data('kendoMenu');

    oNav1.append(oNavData);
    oNav2.append(oNavData);
});

请帮我解决这个问题。

这是我正在尝试创建的导航面板的示例： 在此处输入图像描述

问候，

斯科特

4

2 回答 2

0

That was a bug - and here is the fix.

于 2014-05-23T12:29:21.427 回答
0

不确定它何时停止工作，但我会说当前的行为是可以理解的（尽管可能不是你想要的）。

菜单希望您在其中拥有的是菜单选项，而不是完整的 HTML。因此，当您设置openOnClick为true（与鼠标悬停的默认设置相反）时，Kendo UI 必须做的是拦截该click菜单上任何 HTML 元素上的事件。因此，您会发现它没有按预期打开 URL。

所以，我的问题是，为什么你需要像你一样定义它？可能会这样吗？：

<ul id="nav1">
    <li>
        Administration
        <ul>
            <div>
                <span class="ma-hpm-menuPanelGroupHeader">Application Administration</span>
            </div>
            <li disabled="disabled">Disabled Link</li>
            <li><a target='_blank' class='ma-hpm-panelLink' href='http://www.google.com.au'>Active Link</a></li>
        </ul>
    </li>
</ul>

这里的例子：http: //jsfiddle.net/OnaBai/HLaRx/6/

于 2014-05-20T10:35:44.040 回答