Html 如何在物品选择上打开剑道下拉列表

我在web应用程序中有KendoDropdownlist

 @(Html.Kendo().DropDownList()
        .HtmlAttributes(new { @style = "width: 200px;" })
        .Name("cbStatusFilter" + i)
        .DataTextField("Name")
        .DataValueField("Id")
        .TemplateId("tpStatusFilter")
        .BindTo((System.Collections.Generic.IEnumerable<dynamic>)ViewData["statuses"])
         .Events(c => c.Select("cbFilter_Select").Close("cbFilter_Close"))
    )

它有如下模板

<script type="text/x-kendo-template" id="tpStatusFilter">
    <input type="checkbox" id="#= Name #" name="#= Name #" value="#= Id #" class="check-input-status" #=selected ? "checked" :"" # />
    <label for="#= Name #">#= Name #</label>
</script>

当使用从下拉列表中选择项时，下拉列表将关闭。但我想让它保持打开状态，并在单击其他控件时关闭它 我怎样才能做到呢？

---

谢谢

这是可以做到的，但这是基于对下拉列表JavaScript编写方式的了解。如果Kendo在此时重新编写JavaScript，这个答案可能不起作用

如果查看函数的源代码，您将看到在onChange事件中，剑道下拉代码将切换下拉项的可见性。知道了这一点，您可以通过添加对jQuery的.hidefunction的调用来诱使代码执行您想要的操作。请参见下面代码段中对color.hide`的调用。现在，当剑道控制onChange事件触发时，切换可见性将显示列表

控件将在失去焦点时自动关闭列表，因此您不必担心这一点

var color = $("#color").data("kendoDropDownList");
function onChange() {
      var value = $("#color").val();
      color.hide();
      $("#cap")

此代码基于，并且仅在Chrome中进行了测试

$document.readyfunction{ 调试器； 风险值数据=[{ 文本：黑色， 价值：1 }, { 文本：橙色， 价值：2 }, { 文本：灰色， 价值：3 }]; //从输入HTML元素创建DropDownList var color=$color.kendoDropDownList{ dataTextField:text， dataValueField:值， 数据源：数据， 索引：0， 更改：onChange }; //从selecthtml元素创建DropDownList $size.kendoDropDownList； //重要的 //保存指向实际剑道控制的指针。 //这是调用.hide所必需的 //功能正常工作。 var color=$color.datakendoDropDownList； 颜色。选择0； 变量大小=$size.datakendoDropDownList； 功能变化{ var值=$color.val； 颜色。隐藏； 美元上限 .toggleClassblack cap，值==1 .toggleClassorange cap，值==2 .toggleClassgrey cap，值==3； }; $get.clickfunction{ 警报'谢谢！您的选择是：\n\n颜色ID:'+color.value+'和大小：'+Size.value； }; }; html{ 字体大小：12px； 字体系列：Arial、Helvetica、无衬线字体； } 定制剑道帽 帽色 瓶盖尺寸 S-6 3/4 M-7 1/4 L-7 1/8 XL-7 5/8 定制 .演示部分{ 宽度：460px； 高度：300px； } .演示部分h2{ 文本转换：大写； 字号：1em； 边缘底部：30px； } 帽{ 浮动：左； 宽度：242px； 身高：225px； 保证金：20px 30px 30px 0； 背景图片：url'../content/web/dropdownlist/cap.png'； 背景重复：无重复； 背景色：透明； } .黑帽子{ 背景位置：0； } .灰帽{ 背景位置：0-225px； } .橙色帽子{ 背景位置：0-450px； } 选择权{ 填充：1px0 30px 30px； } 选项h3{ 字号：1em； 字体大小：粗体； 利润率：25px0.8px0； } 得到{ 边缘顶部：25px； }

---

您还可以使用事件计数： 我使用的剑道略有不同，所以你可能需要修改它以适应你使用它的方式

<input id="dropdown" k-keepOpen/>

$("#dropdown").kendoDropDownList({
keepOpen:$("#dropdown")[0].hasAttribute("k-keepOpen"),//this will turn it on and off by your element
preventCloseCnt:0,//this is used for managing the event
select:function(e){ this.preventCloseCnt=2;},//set the counter to bypass closing
close:function(e){
  if(this.keepOpen && this.preventCloseCnt >0 ){//now the next time something tries to close it will work ( unless it's a change )
  e.preventDefault();
  this.preventCloseCnt--;
  }
}
});