text jquery - 在外面点击时隐藏

Posted 2021-05-02

/* hide when click outside */
  $(document).mouseup(function (e) { // событие клика по веб-документу
    console.log($(e.target).hasClass('change-language-button'));
    var div = $(".dropdown-menu-change"); // тут указываем ID элемента
    if (!div.is(e.target) // если клик был не по нашему блоку
      &&
      div.has(e.target).length === 0 // и не по его дочерним элементам
      &&
      !$('.change-language-button').is(e.target) //кнопка на которую нажимают для открытия
      &&
      $('.change-language-button').has(e.target).length === 0
    ) {
      $('.dropdown-menu-change').removeClass("dropdown-menu-change-visible");
    }
  });
  
********************
a.btn-primary#personal-account Личный кабинет

.personal-account-menu-wrapper
  .container
    .personal-account-menu
      span Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quo nihil ipsum ex, iste mollitia nesciunt quaerat sunt commodi. Facilis distinctio doloremque, optio quaerat nulla, atque et perferendis libero aliquid laborum ex cupiditate excepturi adipisci cumque! Atque sit officia ipsa dolores necessitatibus sequi quibusdam, rem accusantium id eius voluptates labore veniam accusamus commodi at quidem expedita? Minus eveniet sequi vitae itaque, necessitatibus qui ducimus! Rem illo perspiciatis laborum, ratione dolor at minima modi, facilis exercitationem quo nisi voluptas ut nulla consectetur aspernatur nemo tempora accusamus fugit quia est, distinctio quos recusandae. Quis praesentium maxime dolores eos quidem laborum culpa similique iste.
---------------------
.personal-account-menu-wrapper
  position: fixed
  top: -100%
  top: 62px
  color: red
  z-index: 2
  width: 100%
  transition: .4s all
  .container
    position: relative
    .personal-account-menu
      width: 271px
      background-color: #2F0D4B
      z-index: 2
      float: right
.personal-account-menu-wrapper-show
  top: 62px
-------------------------
$('#personal-account').on('click', function(e) {
  e.preventDefault();
  $('.personal-account-menu-wrapper').toggleClass('personal-account-menu-wrapper-show');
});
let personalAccount = $('#personal-account');
if (personalAccount.length > 0) {
  $(document).mouseup(function(e) {
    // событие клика по веб-документу
    var div = $('.personal-account-menu'); // тут указываем ID элемента
    if (
      !div.is(e.target) && // если клик был не по нашему блоку
      div.has(e.target).length === 0 && // и не по его дочерним элементам
      !$('#personal-account').is(e.target) && //кнопка на которую нажимают для открытия
      $('#personal-account').has(e.target).length === 0
    ) {
      $('.personal-account-menu-wrapper').removeClass('personal-account-menu-wrapper-show');
    }
  });
}