聚焦时无法选择输入文本答案

【问题标题】：Can't select input text when focused聚焦时无法选择输入文本
【发布时间】：2014-01-27 01:31:08
【问题描述】：

我正在创建一个搜索栏，它在使用时会展开，在不使用时会收缩。我得到了那部分工作，问题是收缩有点过热。当我在栏中写一些东西然后尝试点击我刚刚写的一个词时，我再次缩小了。这很奇怪，因为据我所知，我并没有失去酒吧的焦点，所以为什么要这样做。我正在使用焦点和模糊来触发扩展和收缩。

$(document).ready(function(){
  $(".search_bar").bind('focus blur', function(){
      $('.search_bar').toggleClass('search_bar_focus');
      $('.search_button').toggleClass('search_button_focus');
      $('.logo').toggleClass('logo_focus');
  });

这是我的代码：http://jsfiddle.net/easilyBaffled/bbrP9/3/

【问题讨论】：

标签： jquery css focus blur

【解决方案1】：

问题是 z-index: -1;在 .search_bar:focus, .search_bar:active

在 Firefox 中，这意味着页面实际上堆叠在您输入的前面。它仍然可以接收输入，但是当您单击时，您实际上是在单击文档。

在 chrome 中，它甚至根本无法接收输入。

在任何一种情况下，将 z-index 更改为正数都有效。

【讨论】：