Появляется всплывающее окно Bootstrap, хотя оно должно быть скрыто

Эй, я пытаюсь сделать следующее:

У меня разные кнопки выбора уровня для браузерной игры. Каждая кнопка соответствует одному уровню. После того, как пользователь выбирает уровень, он должен нажать кнопку СТАРТ, чтобы перейти на выбранный уровень. var level получает значение кнопки определенного уровня. например пользователь выбирает первый уровень, поэтому var level = 1;

Когда он нажмет кнопку СТАРТ, не выбрав уровень, появится всплывающее окно с содержимым «сначала выберите уровень». Чтобы скрыть всплывающее окно, щелкнув в любом месте или нажав кнопку уровня, я использую следующий код. В начале var level = undefined и только потом можно вызвать поповер. После того, как пользователь выбрал уровень var level, он больше не является неопределенным, и всплывающее окно не может быть вызвано снова.

Все идет нормально.

Всплывающее окно появляется при нажатии на кнопку СТАРТ без выбора уровня и исчезает при выборе уровня. Но когда пользователь теперь нажимает кнопку START, всплывающее окно появляется снова. Как это возможно?

$('#start').bind("click touchstart", function(e) {
    if (level==undefined) {
        $('#start').popover();
        isVisible = true;
        clickAway = false;
        e.preventDefault();
    }
});

$(document).bind("click touchstart", function() {
    if(isVisible && clickAway) {
        $('#start').popover('hide');
        isVisible = false;
        clickAway = false;
    } else {
        clickAway = true;
    }
}); 

<button type="submit" class="btn btn-success btn-large" rel="popover" data-placement="left" data-content="Choose level first!" value="" id="start" name="start">START!</button>

hide click twitter-bootstrap onclick popover
person skraby    schedule 14.04.2013    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Быстрым решением было бы изменить $('#start').popover('hide'); на $('#start').popover('destroy');, а также добавить data-trigger="manual" к кнопке.

Ниже показано, как я реализовал этот сценарий,

 $(document).bind("click touchstart", function(f) {
  if(f.target.id!="start"){
   if(isVisible)
   {
     $('#start').popover('destroy');
     isVisible = false;
   }
  }  
   else if (level==undefined && !isVisible) {       
    $('#start').popover('show');
    isVisible =true;
  }  
  });
person Anuruddha    schedule 14.04.2013