1

嘿,我想做的是:

我有不同的按钮用于浏览器游戏的级别选择。每个按钮代表一个级别。用户选择一个级别后,他必须单击开始按钮才能进入所选级别。var level获取特定级别按钮的值。例如,用户选择一级,所以var level = 1

当他点击开始按钮而不选择关卡时,会出现一个弹出窗口,内容为“先选择关卡”。要通过单击任意位置或单击级别按钮来隐藏弹出框,我使用以下代码。在开始时var level = undefined,只有这样才能调用弹出框。用户选择后,级别var level不再未定义,并且无法再次调用弹出框。

到目前为止,一切都很好。

弹出框通过单击开始按钮而不选择级别出现,并通过选择级别消失。但是,当用户现在单击“开始”按钮时,弹出框再次出现。这怎么可能?

$('#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>
4

1 回答 1

0

一个快速的解决方法是更改$('#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;
  }  
  });
于 2013-04-14T21:44:14.850 回答