Javascript 关闭输入焦点上的幻灯片菜单

我有一个搜索栏，在幻灯片菜单中有许多额外的选项。我有它所有的工作，但我所需要的是菜单关闭时，你集中在输入再次

选中FIDLE…打开菜单并将焦点放回输入…菜单将保持打开状态，直到您再次单击按钮。请我需要两个选项都工作。我只听说jquery的“keyup”可以实现这一点

到目前为止，我已经准备好了：

$(document).ready(function() {
 $('#showmenu').click(function() {
  $('.search-baner').toggle("slide", { direction: "left" }, 500);
  $("span",this).toggleClass("ion-arrow-right-b ion-arrow-left-b");
  $("#showmenu",this).toggleClass("not-pressed pressed");
  });
});

---

点击输入行吗

$(document).ready(function() {
  $('#showmenu').click(function() {
    $('.search-baner').toggle("slide", {direction: "up"}, 1000);

    // Only add the listenner once the menu is deployed
    $('input').on('click', function() {
      $('.search-baner').toggle("slide", {direction: "up"}, 1000);

        // Remove the listenner since we dont wan't the menu to open if we click again
        $(this).unbind('click');
    });

  });
});

---

单击输入是否正常

$(document).ready(function() {
  $('#showmenu').click(function() {
    $('.search-baner').toggle("slide", {direction: "up"}, 1000);

    // Only add the listenner once the menu is deployed
    $('input').on('click', function() {
      $('.search-baner').toggle("slide", {direction: "up"}, 1000);

        // Remove the listenner since we dont wan't the menu to open if we click again
        $(this).unbind('click');
    });

  });
});

使用该方法

使用该方法

---

问题只在于如何关闭菜单，关注文本输入。就这么简单。也许我写得太多了：）（现在你只能通过再次切换按钮来关闭它）忘了提到幻灯片菜单中还有其他按钮……因此，按你的建议，单击菜单不会有帮助：（…它必须是你点击的输入…，或者只是开始键入。问题只是如何关闭菜单并专注于文本输入。就这么简单。也许我只是写了太多了：）（现在你只能通过再次切换按钮来关闭它）忘了提到幻灯片菜单中还有其他按钮…因此，按您的建议，单击菜单不会有帮助：（…必须是您单击的输入…或者只是开始键入。它正在工作…但是您必须在输入上单击两次，这会让用户感到困惑：）它正在工作…但是你必须在输入上点击两次，这会让用户感到困惑：）谢谢！！！将与此配合…它将在没有幻灯片效果的情况下关闭，但让我们保留这些详细信息供以后使用：）只需使用.toggle（“slide”，{direction:“up”}，1000）；这将是美好的…我有另一个功能，调暗屏幕上的重点…这就是为什么第二次点击…但我现在设法把它全部放在一起，上面的幻灯片工作得很好：）谢谢大家：）谢谢！！！将与此配合…它将在没有幻灯片效果的情况下关闭，但让我们保留这些详细信息供以后使用：）只需使用.toggle（“slide”，{direction:“up”}，1000）；很好，很好…我有另一个功能，可以在对焦时调暗屏幕…这就是为什么第二次点击…但我现在设法把它们都放在一起了，上面的幻灯片很好：）谢谢大家：）