javascript - 尝试根据特定输入字段是否具有焦点来显示元素

Question

正如标题所说，我试图弄清楚如何根据输入字段是否具有焦点来显示元素。

因此，当特定输入字段具有焦点时，我需要显示一个元素，而当它没有焦点时，应隐藏该元素。

我尝试了很多不同的事情，这是我最近的尝试:

    <script>
     $(".only-oslo-delivery").hide();

     if ($("#address_city").is(":focus")) {
      $(".only-oslo-delivery").show();
     };
    </script>

only-oslo-delivery 是一个 < p> 标签，其中包含我想要在输入字段获得焦点时显示的文本。

address_city是输入字段的ID。

Answer 1

您的代码仅运行一次，您需要事件处理程序根据用户操作执行它:

$("#address_city").on('focus', function() {
  $(".only-oslo-delivery").show();
}).on('blur', function() {
  $(".only-oslo-delivery").hide();
})

.only-oslo-delivery {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="address_city">
<p class="only-oslo-delivery">test</p>