Question

如何获取kendoTiemPicker项目的列表元素？每个kendoTimePicker都会生成一个<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.11/lodash.min.js"></script> <p id="key"></p>标签，其中包含我们在时间选择器的下拉列表中看到的所有项目。像这样的东西：

<ul>

但是我在一个页面中有多个kendoTimePickers，因此我在页面中有多个列表。在这些时间选择器之一的<ul tabindex="-1" role="listbox" aria-hidden="true" unselectable="on" class="k-list k-reset" style="overflow: auto;"> <li tabindex="-1" role="option" class="k-item" unselectable="on">00:00</li> <li tabindex="-1" role="option" class="k-item" unselectable="on">01:00</li> <li tabindex="-1" role="option" class="k-item" unselectable="on">02:00</li> <li tabindex="-1" role="option" class="k-item" unselectable="on">03:00</li> ...上，我想访问那个特定的时间选择器的相应项目列表。可悲的是我还没有找到这样做的方法。 Kendo没有给我提供轻松找到list元素的方法或属性，到目前为止，我无法使用jquery选择器访问它们。有帮助吗？

Answer 1

我已经在Kendo的演示页面https://demos.telerik.com/kendo-ui/timepicker/rangeselection上尝试过以下内容

<Select />

我得到了时间选择器的第一个可用条目，其ID为const Option = (props) => { const { ... data, } = props return ( <div ...> {`${data.firstName} - ${data.lastName}`} </div> ) } <Select ... components={{ Option }} ... />。昨天，剑道发布了一个用于演示页面的新版本。但是我想这个ID也会出现在较早的版本中。如果没有，请尝试先更新。

Answer 2

我想我找到了解决方案。在每个timePicker的open事件中，我可以阅读e，并执行以下操作：

open: function (e) {
           let listContainer = e.sender.timeView.list;
       }

和listElement将是我正在寻找的<ul>标签的容器。那么我可以这样做：

let listElement = $(listContainer).find('ul');

就是这样。就这么简单。

如何获取剑道TimePicker的<ul>元素？

2 个答案: