Alex的博客

本博客的文章均为原创,是本人从事行业多年来所遇见一些小问题的解决心得,希望可以帮助到大家!



jquery 定时从后台获取数据并显示在前端

jquery代码:

<script type="text/javascript">
function saveUserInfo()
{

    //接收表单的URL地址
    var url = "<?php echo base_url('alex/notice_select');?>";

    var ajax = false;
    //开始初始化XMLHttpRequest对象
    if(window.XMLHttpRequest)
    {   //Mozilla 浏览器
        ajax = new XMLHttpRequest();
        if (ajax.overrideMimeType)
        {   //设置MiME类别
            ajax.overrideMimeType("text/xml");
        }
    }
    else if (window.ActiveXObject)
    {   // IE浏览器
        try
        {
            ajax = new ActiveXObject("Msxml2.XMLHTTP");
        }
        catch (e)
        {
            try
            {
                ajax = new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch (e) {}
        }
    }
    if (!ajax)
    {   // 异常,创建对象实例失败
        window.alert("不能创建XMLHttpRequest对象实例.");
        return false;
    }

    //通过Post方式打开连接
    ajax.open("GET", url, true);

    //定义传输的文件HTTP头信息
    //ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

    ajax.setRequestHeader("If-Modified-Since","0");
    //发送POST数据
    ajax.send(null);

    //获取执行状态
    ajax.onreadystatechange = function()
    {
        //如果执行状态成功,那么就把返回信息写到指定的层里
        if (ajax.readyState == 4 && ajax.status == 200)
        {
           //返回的数据写入到html
            //cdown.innerHTML = ajax.responseText;
            //把返回的字符串转换成json
            var json = eval("(" + ajax.responseText + ")");
            // alert(fh);
            var da="";

             //遍历json数据
             $.each( json, function(index, content)
  {


            da=da+"<li>";
            da=da+"<a href='<?php echo base_url("data/bbs_article_details");?>/"+content.cid+"'>";
            da=da+"<div>";
            da=da+"<i class='fa fa-envelope fa-fw'></i>"+content.title;
            da=da+"<span class='pull-right text-muted small'>4分钟前</span>";
            da=da+"</div>";
            da=da+"</a>";
            da=da+"</li>";
            da=da+'<li class="divider"></li>';

});


            var divshow = $("#cdown");
                divshow.text("");// 清空数据
                divshow.append(da); // 添加Html内容,不能用Text 或 Val
        }
    }
}
function doUpdate()
{
        saveUserInfo();
        //这里设置定时器时长
        window.setTimeout("doUpdate()", 8000);
}
doUpdate();


</script>


html代码:
<div id="cdown"></div>
 

后台php代码:
//查询是否有通知
public function  notice_select(){
    $uid=$_SESSION['userda']['id'];
    $data['notice']=$this->alex->notice_select($uid);
    if (count($data['notice'])>0) {

        foreach ($data['notice'] as $value) {
            $notice[]=array('id'=>$value->notice_id,'title'=>$value->notice_title,'cid'=>$value->notice_cid);
        }


        echo $temp=json_encode($notice);
    }else{
        echo "0";
    }

}
	
 
注释:后台主要是从数据库查询出数据然后转换成json数据然后输出


浏览2506  评论0  Alex于 2016-10-31 15:42
发言