嘿,我想做的是:
我有不同的按钮用于浏览器游戏的级别选择。每个按钮代表一个级别。用户选择一个级别后,他必须单击开始按钮才能进入所选级别。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>