3

Делал свой селектор и столкнулся с сложностью его скрытия при клике вне области выбора. Подскажите пожалуйста как это можно сделать.

    var selector = $('.selector_status');
    var list = $('.list_status');
    var option = $('.option');
    var flag = 0;
    var saveVal;
    var saveText;

    selector.on('click', function() {

      if (flag == 0) {

        flag = 1;
        list.css('display', 'block');

      } else {

        flag = 0;
        list.css('display', 'none');

      }
      return false;
    });

    option.on('click', function() {

      saveVal = option.attr('val');
      saveText = option.text();

      option.attr('val', selector.attr('val'));
      option.text(selector.text());

      selector.attr('val', saveVal);
      selector.text(saveText);

      flag = 0;
      list.css('display', 'none');

      return false;
    });
<div class="selector selector_status" val="yes" name="event_status">Проведено</div>
<div class="result_list list_status" style="display: none; visibility: visible;">
  <ul style="position: relative; visibility: visible;">
    <li class="option" val="no">Не проведено</li>
  </ul>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

Пробовал вот таким вот способом:

$(document).click(function(event) {
    if ($(event.target).closest('.list_status').length) return;
    else {
        $('.list_status').css('display', 'none');
    }
 });

Но минус в том, что он не всегда срабатывает, а если и срабатывает, то для того, чтобы снова открыть "лист" нужно кликать 2 раза.

1 ответ 1

3

flag = 0; забыли

$(document).click(function(event) {
    if ($(event.target).closest('.list_status').length) return;
    else {
        flag = 0; // вот тут нужен
        $('.list_status').css('display', 'none');
    }
 });
1
  • Спасибо !!!!!!!! 8 июл 2015 в 9:53

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.