javascript - Chrome 提示出现过快
问题描述
我有一个代码,当我按下按钮时,屏幕会随着div
可见性而变化。在Edge中,一旦旧屏幕消失,就会加载新屏幕,然后出现提示。但是,在Chrome中,提示会在新屏幕加载之前甚至在旧屏幕消失之前出现。我正在做一个图片测验,所以在提示之前显示新页面(带有图片)很重要。有什么办法可以延迟 Chrome 提示符吗?
不可能先加载整个页面,因为它将直接结束测验,因为它处于循环状态。
function classic() {
document.getElementById('explain').style.display = "none";
document.getElementById('game').style.display = "block";
document.body.style.background = "grey";
var quiz = [
[1, 'Which country is this flag from?', 'netherlands'],
[2, 'Which country is this flag from?', 'belgium'],
[3, 'Which country is this flag from?', 'france'],
[4, 'Which country is this flag from?', 'germany'],
[5, 'Which country is this flag from?', 'united kingdom'],
[6, 'Which country is this flag from?', 'italy'],
[7, 'Which country is this flag from?', 'russia'],
[8, 'Which country is this flag from?', 'norway'],
[9, 'Which country is this flag from?', 'brazil'],
[10, 'Which country is this flag from?', 'morocco'],
[11, 'Which country is this flag from?', 'united states'],
[12, 'Which country is this flag from?', 'kazakhstan'],
[13, 'Which country is this flag from?', 'japan'],
[14, 'Which country is this flag from?', 'argentina'],
[15, 'Which country is this flag from?', 'portugal'],
[16, 'Which country is this flag from?', 'luxembourg'],
[17, 'Which country is this flag from?', 'mexico'],
[18, 'Which country is this flag from?', 'china'],
[19, 'Which country is this flag from?', 'egypt'],
[20, 'Which country is this flag from?', 'nigeria']
];
var nummer = 0;
var answer;
var response;
var score = 0;
for (var i = 0; i < quiz.length; i += 1) {
nummer++
document.getElementById('flag').src = "flags/flag" + nummer + ".png";
answer = prompt(quiz[i][1]);
if (answer === null) {
window.alert("You cancelled the prompt. Please reload the page to play again.")
}
response = answer.toLowerCase();
if (response === quiz[i][2]) {
score++
我希望在显示测验中的第一张图片后显示提示。
解决方案
您可以使用setTimeout或设置 Interval 直到元素可见,然后显示提示。在这里找到几乎相同的答案
setTimeout(function(){ // Do your thing here e.g show promt
}, 3000); // It will show promt after 3 seconds
这里设置了间隔
var visibility= setInterval(function() {
if ($('#element').length) {
//Stop the interval when it is visible
clearInterval(visibility);
}
}, 300);
推荐阅读
- windbg - 从完整的内存转储中查看托管堆栈
- python - Pandas DataFrame 多线程没有性能提升
- php - 使用title从数据库codeigniter中获取数据
- javascript - 在具有相同类的列表之间进行反应切换
- python - 在 Python 3.6 上导入 tensorflow 问题
- android - 下载管理器不接受没有扩展名的 url
- android - React Native - 获取非 https url 时出现“网络请求失败”
- python - 使用 docker-py 从现有容器运行 docker 容器
- debugging - React 导航:如何调试
- vba - 共享存储在 PRIVATE 模块中的变量