【学习笔记】ajax执行时的提示

最新推荐文章于 2022-06-30 04:13:02 发布

weixin_30251829

最新推荐文章于 2022-06-30 04:13:02 发布

阅读量138

点赞数

文章标签： xhtml php javascript ViewUI

原文链接：http://www.cnblogs.com/littlefly/p/3661624.html

版权

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>demo3</title>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script>
$(function(){
    $('input').click(function(){
        var ul = $('#info>ul');
        $.ajax({
            url:'demo3.php?'+Math.random(),
            type:'get',
            success:function(data){
                var result = eval(data);
                for(var i = 0;i<result.length;i++){
                    // result[i].title;
                    ul.append('<li>'+result[i].title+'<em>'+result[i].publicTime+'</em></li>');
                }
            }
        });
    });
    
    $(document).ajaxStart(function(){
        $('#loading').show();
    }).ajaxStop(function(){
        $('#loading').hide();
    });
});
</script>
</head>
<body>
<input type="button" value="获取新闻列表" />
<div id="info">
    <img src="loading.gif" alt="" id="loading" style="display:none;" />
    <ul></ul>
</div>
</body>
</html>