Question

根据documentation，我应该可以通过在窗口小部件配置中包含“navigatable：false”来关闭Kendo UI TabStrip窗口小部件中的键盘导航。但是，我无法让这个工作。我做了一个简化（见下文），其中包含了最低限度，以说明我的困境。我是否遗漏了某些内容，或者这看起来像是图书馆中的错误？

以下是代码段示例。要为标签条提供键盘焦点，只需单击其中的任意位置即可。然后，当我希望禁用键盘导航时，按下箭头键将导航标签条。

$(document).ready(function() {
  $("#tabstrip").kendoTabStrip({
    navigatable : false
  });
});

<link href="http://da7xgjtj801h2.cloudfront.net/2014.1.318/styles/kendo.common.min.css" rel="stylesheet"/>
<link href="http://da7xgjtj801h2.cloudfront.net/2014.1.318/styles/kendo.rtl.min.css" rel="stylesheet"/>
<link href="http://da7xgjtj801h2.cloudfront.net/2014.1.318/styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
<link href="http://da7xgjtj801h2.cloudfront.net/2014.1.318/styles/kendo.dataviz.min.css" rel="stylesheet" type="text/css" />
<link href="http://da7xgjtj801h2.cloudfront.net/2014.1.318/styles/kendo.dataviz.default.min.css" rel="stylesheet" type="text/css" />
<link href="http://da7xgjtj801h2.cloudfront.net/2014.1.318/styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://da7xgjtj801h2.cloudfront.net/2014.1.318/js/kendo.all.min.js"></script>
<div id="tabstrip">
  <ul>
    <li class="k-state-active">Tab A</li>
    <li>Tab B</li>
  </ul>
  <div>
    <div>Content for Tab A</div>
  </div>
  <div>
    <div>Content for Tab B</div>
  </div>
</div>

Answer 1

此navigatable选项于2014年6月25日首次在2014年第二季度测试版中推出。我认为您使用的版本不包括它。尝试使用较新的2014.2.716

＆＃13;

$(document).ready(function() {
  $("#tabstrip").kendoTabStrip({
    navigatable : false
  });
});

＆＃13;

<link href="http://da7xgjtj801h2.cloudfront.net/2014.2.716/styles/kendo.common.min.css" rel="stylesheet"/>
<link href="http://da7xgjtj801h2.cloudfront.net/2014.2.716/styles/kendo.rtl.min.css" rel="stylesheet"/>
<link href="http://da7xgjtj801h2.cloudfront.net/2014.2.716/styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
<link href="http://da7xgjtj801h2.cloudfront.net/2014.2.716/styles/kendo.dataviz.min.css" rel="stylesheet" type="text/css" />
<link href="http://da7xgjtj801h2.cloudfront.net/2014.2.716/styles/kendo.dataviz.default.min.css" rel="stylesheet" type="text/css" />
<link href="http://da7xgjtj801h2.cloudfront.net/2014.2.716/styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
<script src="http://da7xgjtj801h2.cloudfront.net/2014.2.716/js/jquery.min.js"></script>
<script src="http://da7xgjtj801h2.cloudfront.net/2014.2.716/js/kendo.all.min.js"></script>
<div id="tabstrip">
  <ul>
    <li class="k-state-active">Tab A</li>
    <li>Tab B</li>
  </ul>
  <div>
    <div>Content for Tab A</div>
  </div>
  <div>
    <div>Content for Tab B</div>
  </div>
</div>

＆＃13;

如何在Kendo UI TabStrip中禁用键盘导航？

1 个答案: