jQuery AJAx

Ajax = 异步javascript xml

通过异步的ajax请求。根据回调函数的返回值动态的刷新页面的值(需要动作触发此请求,或者设置定时轮询)

• 在不重载整个页面的情况下ajax通过后台加载数据 并在页面上显示
• jQuery - AJAX load() 方法
• $(select).load(url,data,callback);
• $.get(url,callback) 从服务器的文件中取回数据 callback 取回成功后执行的回调函数
• $.post(url.data,callback)
  -通过 json_encode 和json_decode 进行解码和编码

//controller
    function updateAction(){
    $article = \Articles::findById($this->params('tg'));
    $article->thumb += 1;
    if($article->update()){
        $this->renderJson(ERROR_CODE_SUCCESS,'',['thumb' => $article->thumb, article => $article->toJson()]);
    }else{
        $this->renderJson(ERROR_CODE_SUCCESS,'failed')；
    }
}

//volt
    <div id="thumb{{ article.id }}">{{ article.thumb }}赞</div>

    <a href="/visitor/articles/update/{{ article.id }}" class="edit_action" data-target="{{ article.id}}">[👍]</a>
    
    <script type="text/template" id=article_tpl>
        <tr id="article_${article.id}">
            <td>
                <a href="/visitor/articles/update/${article.id}" class="edit_action" data-target="#article_${article.id}">赞</a>
            </td>
        </tr>
    </script>
    
    <script>
        $(function(){
            $(".edit_action").click(function (event) {
                event.preventDefault();
                var url = $(this).attr("href");
                var target = $this.data("target");
            
                $.post(url,{tg:target},function (resp){
                        if(resp.error_code == 0){
                            var res = resp.thumb;
                            $("#thumb" + target).html(res + "赞")；
                        }
                 });
            })；
    
        });
    </script>

• 如果想做点赞状态的取消 有两种思路:
  -（点赞状态0 未点赞状态1）
• a.限制24小时内该ID用户均可点赞或取消 给用户设置两个状态 【0 赞数加一 1 赞数减一】

• 每二十四小时将状态置为未点赞状态
  

• b.将点赞状态与SID绑定 临时存储【sid，点赞状态】 根据点赞状态对数据库点赞数处理
  点赞状态与数据库点赞数同步更新