События потеря фокуса двух объектов

589

24 ноября 2016, 10:34

$("#formaddnews").click(function(){ 
    $("#formaddnewsmenu ").animate({opacity: "show"}, 500);
    if ($("#formaddnewsmenu").blur && $("#formaddnews").blur) {$("#formaddnewsmenu").animate({opacity: "hide"}, 500);};
    });

Помогите с фокусом!

Как мне сделать что бы при потери фокусом двух объектов один из них прятался

HTML код

<form>
<input id="formaddnews" class="formaddnews" placeholder="Добавить запись на стене" type="text">
<form>
</center>

</div>
<div id="formaddnewsmenu" style="">
<img src="images/camera_7603.png">
<img src="images/forward_1087.png">
<img src="images/volume2_2290.png">
<div align="center" id="form_add_news_menu_bottom">Опубликовать</div>

JS скрипт

   <script>
    $("#formaddnews").click(function(){ 
    $("#formaddnewsmenu ").animate({opacity: "show"}, 500);
    });
$("#formaddnewsmenu").focusout(function() {
  $("#formaddnewsmenu ").animate({opacity: "hide"}, 500);
})
  </script>

Answer 1

На Jquery с помощью .focusout() можно отследить потерю фокуса.

$("#formaddnewsmenu").focusout(function() { 
  $("#formaddnewsmenu ").animate({opacity: "hide"}, 500); 
})

.inputs { 
    float: left; 
    margin-right: 1em; 
  } 
  .inputs p { 
    margin-top: 0; 
  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div class="inputs"> 
  <p> 
    <input id="formaddnewsmenu" type="text"> 
  </p> 
</div> 
<div id="focus-count"></div>