Question

我的引导程序下拉列表有一个文本框，它使用了jquery自动完成功能。由于以下代码，当我单击并键入文本框时，下拉列表保持打开状态。但是，当我点击自动完成选项时，整个下拉列表会隐藏。我该如何解决这个问题？

  $('#myDropdown').click(function(e) {
                    e.stopPropagation();
                });
 <ul class="dropdown-menu" role="menu" aria-labelledby="menu1">
                    <li role="presentation"><b>Enter value:</b>
                        <input type="text" id="entityId" value="">
                    </li>
                </ul>

Answer 1

我使用$（＆＃34; .selector＆＃34;）。on（＆＃34; autocompleteclose＆＃34;，function（event，ui）{}）; 从此页面：jquery autocomplete documentation。

例如：

<li class="dropdown" id="searchDropDown">
<a class="dropdown-toggle" data-toggle="dropdown" data-delay="1000" id="navSearch">Search <b class="caret"></b></a>
<div class="dropdown-menu" style="padding:17px;">
    <form class="form" id="formSearch"> 
        <label class="formLabel" for="searchID">Device ID</label><br>
        <div class="ui-widget">
            <input name="deviceID" id="searchID" type="text"><br>
        </div>
        <label class= "formLabel" for="date1">Date Range</label><br>    
        <input name="date1" id="datepicker1" type="text" placeholder="To"><br>
        <input name="date2" id="datepicker2" type="text" placeholder="From"><br>
        <button type="button" id="btnSearch" class="btn">Search</button>
    </form>
</div>

//Keep autocomplete selection from closing search dropdown.
$('#searchID').on("autocompleteclose", function(e){
  e.stopPropagation();
});

就是这样。

JQuery Dropdown在自动完成点击时消失

1 个答案: