个人中心
文章发布
退出
作者热门文章
- iOS/Objective-C 元类和类别
- objective-c - -1001 错误，当 NSURLSession 通过 httpproxy 和/etc/hosts
- java - 使用网络类获取 url 地址
- ios - 推送通知中不播放声音
27
4
我的网站上有三个页面。
第 1 页:用户输入数据库搜索条件的简单页面
第 2 页:HTML5 Adobe Edge 动画页面
第3页:搜索结果页
第 1 页加载速度非常快。第 2 页和第 3 页加载缓慢(每页约 3 秒)。
当用户在 Page 1 中输入他们的搜索条件时，我想加载 page 2。一旦用户在 page 1 上按下 enter，我希望 page 2 立即显示。当 page 2 正在显示(动画)时，我想加载 page 3。 第 3 页 加载后但不是 5 秒之前 我想要加载 第 3 页。
每个人的出色回答:好的。以下是可能最有效的方法:欢迎评论!!!!
<script>
$(document).on('pageinit', '#first', function(){
$('#search').click(function(){ // When user submits form
$.ajax({ // Call HTML for page 2 (adobe edge animation)
url: "mypage2.html",
success: function(html){ //When receiving data :
$('#second').html(html); //puts data into second div
$('#first').hide(); //hides the first one
$('#second').show(); //shows the second one
setTimeout(showThird,5000); //pretending there's a loading, only for demo purposes
}
})
});
$.ajax({ // Call HTML for page 3 (adobe edge animation)
url: "mypage3.html",
success: function(html){ //When receiving data :
$('#third').html(html); //puts data into third div
$('#third').hide(); //hides the third one
}
})
function showThird(){ // hides second div, show third div.
$('#second').hide();
$('#third').show();
}
});
</script>
</head>
<body>
<div id="first">
<input type="button" id="search">
</div>
<div id="second">
</div>
<div id="third">
</div>
</body>
</html>
我真的需要一些帮助来找出执行此操作的最佳方法。我已经在使用 jQuery 和 jQuery Mobile。
最佳答案
HTML 和呈现它的浏览器并非天生如此。您不能按照您的建议将页面排队到加载缓冲区中。 HTML 以同步方式执行命令，即:当一个页面被调用时，旧页面被丢弃，新页面开始加载。没有办法改变这个事实……但是，有一些技巧可以让您获得您正在寻找的效果的错觉。
正如在另一个答案中提到的，AJAX(异步 Javascript 和 XML)是当今几乎每个站点/应用程序都使用的一种技术，它允许您通过异步调用将内容提取到预先存在的页面中。 jQuery 使 AJAX 调用变得相当简单，因此我会让您查找必要的代码。
您可能需要考虑在加载表单页面时加载动画页面(我假设它是加载动画)。无需额外调用以拉取动画页面，您只需先隐藏动画...并在提交表单时显示它...然后在将新信息拉到页面上时再次隐藏它!
关于javascript - 如何在第 2 页加载时在第 1 页显示 Div 并在 setTimeout 后显示第 2 页，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20973514/
27
4
0
要求:用户连续扫描文本框中的作业编号，没有任何延迟。对于每个职位编号，我需要在后台调用 API 来获取扫描职位编号的详细信息。 我做了什么:我编写了一个小模拟代码来激发这个需求。我使用 setTime
我遇到了一个问题:该代码应该按该顺序输出“hi1”“hi2”“hi3”“hi4”。我写了这个简化的代码，实际代码更复杂，导致我无法删除我标记的一些功能。 function test() { c
我的页面上有一个动态创建的 iframe。像这样: var iframe = document.createElement('iframe'); iframe.setAttribute("id","m
我确信这是一个被问过很多次的通用问题，但找不到解决方案。 我有 javascript 使用 setTimeout() 函数来关闭我在设定时间后创建的弹出窗口。 问题:如果我在与创建弹出窗口的脚本相同的
我想在第一个函数完成后执行第二个函数。 结果: i: 0,i: 1,...,i: 9, j: 0,j: 1,...,j: 9 function first(callback){ for
我正在尝试创建一个按钮，以反馈其正在执行的操作。在 Angular 中，我向服务器发出一个放置请求——此时我更改按钮的状态以指示这一点——然后当我收到响应时，我再次更改按钮的状态以反射(reflect
我正在尝试制作一个字符串，它会逐个字母地写出自己直到完成句子，并且每个字母出现的速度基于从 1 到 10 不等的输入。在字符串的末尾，它会闪烁5 秒，直到外星人出现。我的想法是创建一个 setInte
在 Meteor 中，为什么要使用 Meteor.setTimeout() 而不是普通的 setTimeout()？ 使用 Meteor.setTimeout() 而不是单纯的 setTimeout
我有这个代码 - function example() { var i = 0; function add() { i++; } setTimeout(
我想知道它们之间有什么区别 window.setTimeout(myFancyFunciton, 1000); 和 setTimeout(myFancyFunciton, 1000); 两者似乎都在做
好吧，我好像遇到了问题。我正在尝试创建一个twicker 来显示数据行。我正在使用 jquery/javascript 在一定时间后隐藏和显示行。代码如下: var timer_is_on
编辑:我最终想在以后使用 setTimeout 恢复变量的先前值 我创建了以下示例来说明我的观点:( JSFiddle ) Push the button Try it var x = {};
我一直在像这样在没有窗口父级的情况下使用超时: setTimeout(FUNC, 1000); 我很好奇，我应该这样使用它吗？ window.setTimeout(FUNC, 1000); 有区别吗？
我有一个使用 setTimeout 函数执行动画的函数，结构如下: animation: function() { //first setTimeout(function(){ mak
关闭。这个问题是not reproducible or was caused by typos .它目前不接受答案。 这个问题是由于错别字或无法再重现的问题引起的。虽然类似的问题可能是on-topi
这是一个快速的(损坏的)jsfiddle:http://jsfiddle.net/wH2qF/ 由于某种原因这不起作用...是因为我在另一个 setTimeout 的处理程序中有一个 setTimeo
我有两个 setTimouts，如下所示，根据 if 条件，我想跳过一个超时。 var batchID = []; batchID = getBatchIDs();//this function ge
我只看到一种情况我应该使用 window.setTimeout 而不是 setTimeout，当我在我的闭包，这显然不是很好的做法(除非有非常特殊的用途)。 我注意到 Google Closure 编
我看到这个用了很多，有人告诉我把函数引用放在引号之间是不好的，因为 setTimeout/setInterval evals 引用。这两者之间的实际区别是什么，以至于一个被使用在另一个之上？为什么我看
我正在使用“setTimeout”函数。此代码按预期运行: function myFunction() { console.log('test'); setTimeout(myFunc
我是一名优秀的程序员,十分优秀！