Question

Html：

<input id="input-smth`enter code here`" type="text" name="region" placeholder="Region" />

<ul class="nav">   <!-- "KB Menu"   -->
    <li class="dropdown kb_menu hideit">
      <a href="#" class="dropdown-toggle" data-toggle="dropdown">Knowledge Bases<b class="caret"></b></a>
      <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel" id="kb_menu">
        <li>1</li>
        <li>2</li>
        <li>3</li>
      </ul>
    </li>
</ul>

使用Javascript：

$('#input-smth').on('keydown', function( event ){
    $('#kb_menu').dropdown('toggle');
    event.stopPropagation();

});

当打开输入下拉列表，然后打开第二个类型时，它会关闭。当我继续输入时，如何防止切换和保持下拉？

Answer 1

由于你使用toggle，它会为每个keydown切换（显示/隐藏）。

您可以使用keydown显示并添加一个按钮来关闭它，或者在焦距不对时隐藏它。

在keydown：

时显示focusout张隐藏

$('#input-smth').on('keydown', function( event ){
  $('#kb_menu').show();
  event.stopPropagation();
});

$("#input-smth").focusout(function() {
  $('#kb_menu').hide();
});

JsFiddle

Answer 2

如果您将open更改为$('#kb_menu').dropdown('open');？

open

我只是猜测var isOpen = false; $('#input-smth').on('keydown', function( event ){ // If is open don't go any further if ( isOpen ) { return } // Otherwise toggle the menu $('#kb_menu').dropdown('toggle'); event.stopPropagation(); isOpen = true });可以是一个解决方案，因为我不知道你正在使用哪个下拉列表插件。

否则一个简单的控制器就应该这样做：

runSuite()

防止在keydown关闭

2 个答案: