setInterval()的一应用实例(ajax)
作者: 郑晓 分类: javacript 发布于: 2012-05-10 12:56 浏览:11,148 没有评论
代码使用setInterval()来每隔5秒自动调用get()函数,get()会通过ajax方法请求php文件。本段代码的php文件中是访问数据库,查询是否有符合的数据,如果有则在页面的左下角弹出一个div(bottom:0),如果无符合要求的数据,则将div的bottom减140进行隐藏。
<script type="text/javascript" src="/js/jquery.js"></script>
<style type="text/css">
#msg{width:200px;position:absolute;left:10px;bottom:0px;height:140px;border:solid 1px #96D0EF;background:#E3F0F8;}
</style>
<script type="text/javascript">
function get() {
$.ajax({
url: "/ajax.php?action=checktips", //ajax请求
cache: false,
success: function(html){
if (html.length>0) {
$("#msg").animate({bottom:0});
$("#msg").html(html);
} else {
$("#msg").animate({bottom:-140});
$("#msg").html("");
}
}
});
}
var t=setInterval("get()",5000); //每5秒执行get()函数;
</script>
<div id="msg"></div>
<style type="text/css">
#msg{width:200px;position:absolute;left:10px;bottom:0px;height:140px;border:solid 1px #96D0EF;background:#E3F0F8;}
</style>
<script type="text/javascript">
function get() {
$.ajax({
url: "/ajax.php?action=checktips", //ajax请求
cache: false,
success: function(html){
if (html.length>0) {
$("#msg").animate({bottom:0});
$("#msg").html(html);
} else {
$("#msg").animate({bottom:-140});
$("#msg").html("");
}
}
});
}
var t=setInterval("get()",5000); //每5秒执行get()函数;
</script>
<div id="msg"></div>
本文采用知识共享署名-非商业性使用 3.0 中国大陆许可协议进行许可,转载时请注明出处及相应链接。
本文永久链接: https://www.zh30.com/setinterval-application-examples-ajax.html