Question

我想动态禁用kendo菜单子项。我已经定义了像

这样的剑道菜单

Html:
<div id="menu"></div>
<button id='enable'>Enable</button>

Jquery的：

$("#menu").kendoMenu({
    dataSource:[{text:"Actions",value:1,items:[{text:"First",value:2},{text:"Second",value:2}]}]
});

现在我要禁用第二项。在按钮上单击我想启用菜单

$("#enable").on('click',function(){
     // here i want to enable the second
});

我该怎么做。

Answer 1

请尝试以下代码：

var menu = $("#menu").kendoMenu().data("kendoMenu");    
menu.enable("li:last", false);

参考：http://jsfiddle.net/ramsunvtech/VXEEN/

更新：2016年12月26日

var menu = $("#menu").kendoMenu().data("kendoMenu");

$("#enable").on('click', function() {
  menu.enable("li:last", true);
});

$("#disable").on('click', function() {
  menu.enable("li:last", false);
});

<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.1118/styles/kendo.common-material.min.css" />
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.1118/styles/kendo.material.min.css" />
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.1118/styles/kendo.material.mobile.min.css" />

<script src="//kendo.cdn.telerik.com/2016.3.1118/js/jquery.min.js"></script>
<script src="//kendo.cdn.telerik.com/2016.3.1118/js/kendo.all.min.js"></script>

<button id='disable'>Disable Last Item</button>
<button id='enable'>Enable Last Item</button>

<ul id="menu">
  <li>
    Continents
    <ul>
      <li>
        Asia
        <ul>
          <!-- moving the UL to the next line will cause an IE7 problem -->
          <li>India</li>
          <li>China</li>
          <li>Japan</li>
          <li>South Korea</li>
        </ul>


      </li>
      <li>Europe</li>
      <li>Middle East</li>
    </ul>
  </li>
</ul>

API参考：http://docs.telerik.com/kendo-ui/api/javascript/ui/menu

Answer 2

阅读本文 http://docs.kendoui.com/api/web/menu#methods-enable

你必须以某种方式定位你想要的选择。例如，如果您为菜单提供了模板，而您的第二个选择的ID为“秒”，那么这就是您禁用它的方式

var menu = $("#menu").data("kendoMenu");
menu.enable("#second", false);

Answer 3

要引用列表中的任何项目，您可以使用:eq jQuery Selector。

var menu = $("#menu").kendoMenu().data("kendoMenu");    
menu.enable("li:eq(1)", false);

您只需将项目的索引作为参数传递。

如何禁用kendo菜单子项

3 个答案: