码迷，mamicode.com
首页 > Web开发 > 详细

ajax 留言板

时间：2015-02-23 01:23:05      阅读：276      评论：0      收藏：0      [点我收藏+]

标签：

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>留言本</title>
    <link rel="stylesheet" href="css.css" type="text/css" />
    <script src="ajax.js"></script>
    <script>
    window.onload = function ()
    {
        //初始化
        var ouser = document.getElementById(‘user‘);
        var ouserinfo = document.getElementById(‘userinfo‘);
        var oreg = document.getElementById(‘reg‘);
        var ologin = document.getElementById(‘login‘);
        
        updata();
        
        function updata()
        {
            var uid = getCookie(‘uid‘);
            var username = getCookie(‘username‘);
            
            
            if(uid)
            {
                //登陆状态
                ouser.style.display = ‘block‘;
                ouserinfo.innerHTML = username;
                oreg.style.display = ‘none‘;
                ologin.style.display = ‘none‘;
                
            }
            
            else
            {
                ouser.style.display = ‘none‘;
                ouserinfo.innerHTML = ‘‘;
                oreg.style.display = ‘block‘;
                ologin.style.display = ‘block‘;
            }
            
        };
        
        showlist();//列出其中几条
        
        //验证用户名开始
        var ousername1 = document.getElementById(‘username1‘);
        var overifyUserNameMsg = document.getElementById(‘verifyUserNameMsg‘);
        ousername1.onblur = function ()
        {
            ajax(‘get‘,‘guestbook/index.php‘,‘m=index&a=verifyUserName&username=‘+this.value,function (data)
            {
                var d = JSON.parse(data);
                overifyUserNameMsg.innerHTML = d.message;
                if(d.code)
                {
                    overifyUserNameMsg.style.color = ‘red‘;
                }
                else
                {
                    overifyUserNameMsg.style.color = ‘green‘;
                }
            });
        }
        //验证用户名结束
        
        //用户注册开始
        var opassword1 = document.getElementById(‘password1‘);
        var obtnReg = document.getElementById(‘btnReg‘);
        
        obtnReg.onclick = function ()
        {
            ajax(‘post‘,‘guestbook/index.php‘,‘m=index&a=reg&username=‘+encodeURI(ousername1.value)+‘&password=‘ + opassword1.value,function (data)
            {
                var d = JSON.parse(data);
                alert(d.message);
                
            });
        }
        //用户注册结束
        
        //用户登录开始
        var ousername2 = document.getElementById(‘username2‘);
        var opassword2 = document.getElementById(‘password2‘);
        var obtnLogin = document.getElementById(‘btnLogin‘);
        
        obtnLogin.onclick = function ()
        {
            ajax(‘post‘,‘guestbook/index.php‘,‘m=index&a=login&username=‘+encodeURI(ousername2.value)+‘&password=‘ + opassword2.value,function (data)
            {
                
                    var d = JSON.parse(data);
                    alert(d.message);
                    if(!d.code)
                    {
                        updata();
                    }
                });
        }
        //用户登录结束
        
        //用户退出开始
        var ologout = document.getElementById(‘logout‘)
        ologout.onclick = function ()
        {
            ajax(‘get‘,‘guestbook/index.php‘,‘m=index&a=logout‘,function (data)
            {
                var d = JSON.parse(data);
                alert(d.message);
                if(!d.code)
                {
                    updata();
                }
            });
            
            return false;
        }
        //用户退出结束
        
        //用户留言开始
        var ocontent = document.getElementById(‘content‘);
        var obtnPost = document.getElementById(‘btnPost‘);
        obtnPost.onclick = function ()
        {
            ajax(‘post‘,‘guestbook/index.php‘,‘m=index&a=send&content=‘+encodeURI(ocontent.value),function (data)
            {
                var d = JSON.parse(data);
                alert(d.message);
                if(!d.code)
                {
                    createList(d.data,true);
                }
            })
        }
        //用户留言结束
        var olist = document.getElementById(‘list‘);
        
        function createList(data,insert)
        {
            var odl = document.createElement(‘dl‘);
            var odt = document.createElement(‘dt‘);
            var ostrong = document.createElement(‘strong‘);
            ostrong.innerHTML = data.username;
            odt.appendChild(ostrong);
            
            var odd1 = document.createElement(‘dd‘);
            odd1.innerHTML = data.content;
            
            var odd2 = document.createElement(‘dd‘);
            odd2.className = ‘t‘;
            var oa1 = document.createElement(‘a‘);
            oa1.href =‘‘;
            oa1.innerHTML = ‘顶(<span>‘+data.support+‘</span>)‘;
            var oa2 = document.createElement(‘a‘);
            oa2.href = ‘‘;
            oa2.innerHTML = ‘踩(<span>‘+data.oppose+‘</span>)‘;
            
            odd2.appendChild(oa1);
            odd2.appendChild(oa2);
            
            odl.appendChild(odt);
            odl.appendChild(odd1);
            odl.appendChild(odd2);
            
            if(insert && olist.children[0])
            {
                olist.insertBefore(odl,olist.children[0]);
            }
            else
            {
                olist.appendChild(odl);
            }
        }
        
        //点击查看更多内容
        var oshowMore = document.getElementById(‘showMore‘);
        var ipage = 1;
        oshowMore.onclick = function ()
        {
            ipage++;
            showlist();
        }
        
        function showlist()
        {
            ajax(‘get‘,‘guestbook/index.php‘,‘m=index&a=getList&n=2&pages=‘ + ipage,function (data)
            {
                var d = JSON.parse(data);
                var data = d.data;
                
                if(data)
                {
                    for(var i = 0; i < data.list.length; i++ )
                    {
                        createList(data.list[i]);
                    }
                } 
                else
                {
                    if(ipage == 1)
                    {
                        olist.innerHTML = ‘现在还没有留言，快来请沙发...‘;
                    }
                    oshowMore.style.display = ‘none‘;
                    
                }
            })
        }
        
        //获取cookie
        
        function getCookie(key) 
        {
            var arr1 = document.cookie.split(‘; ‘);
            for (var i=0; i<arr1.length; i++) 
            {
                var arr2 = arr1[i].split(‘=‘);
                if (arr2[0]==key) 
                {
                return arr2[1];
                }
            }
        }
    }
    </script>
</head>

<body>
    <div id="header"></div>

    <div id="container">

        <div id="list">
        <!--<dl>
                <dt>
                    <strong>zmouse</strong> 说 :
                </dt>
                <dd>内容</dd>
                <dd class="t">
                    <a href="javascript:;" id="support">顶(<span>0</span>)</a>
                     | 
                    <a href="javascript:;" id="oppose">踩(<span>0</span>)</a>
                </dd>
            </dl>-->
        </div>
        <div id="showMore">显示更多...</div>

        <div id="sidebar">
        
            <div id="user" style="margin-bottom: 10px;">
                <h4><span id="userinfo"></span> <a href="" id="logout">退出</a></h4>
            </div>
        
            <!-- 注册 -->
            <div id="reg">
                <h4>注册</h4>
                <div>
                    <p>用户名：<input type="text" name="username" id="username1"></p>
                    <p id="verifyUserNameMsg"></p>
                    <p>密码：<input type="password" name="password" id="password1"></p>
                    <p><input type="button" value="注册" id="btnReg" /></p>
                </div>
            </div>

            <!-- 登陆 -->
            <div id="login">
                <h4>登陆</h4>
                <div>
                    <p>用户名：<input type="text" name="username2" id="username2"></p>
                    <p>密码：<input type="password" name="password2" id="password2"></p>
                    <p><input type="button" value="登陆" id="btnLogin" /></p>
                </div>
            </div>
            
            <!-- 留言发表 -->
            <div id="sendBox">
                <h4>发表留言</h4>
                <div>
                    <textarea id="content"></textarea>
                    <input type="button" value="提交" class="btn1" id="btnPost" />
                </div>
            </div>
        </div>

    </div>
    
</body>
</html>
<?php
/**
 * @ controller Index.class.php
 * @ zmouse@vip.qq.com
 */

defined(‘IN_APP‘) or exit(‘Denied Access!‘);

class IndexController extends Controller {

    public function index() {
        echo ‘<p>欢迎</p>‘;
        //$result = $this->db->get("select * from users", 1);
        //dump($result);
    }

    /**
     * @ interface 用户名验证
     */
    public function verifyUserName() {
        
        $username = trim(isset($_REQUEST[‘username‘]) ? $_REQUEST[‘username‘] : ‘‘);
        
        switch ($this->_verifyUserName($username)) {
            case 0:
                $this->sendByAjax(array(‘message‘=>‘恭喜你，该用户名可以注册！‘));
                break;
            case 1:
                $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘用户名长度不能小于3个或大于16个字符！‘));
                break;
            case 2:
                $this->sendByAjax(array(‘code‘=>2,‘message‘=>‘对不起，该用户名已经被注册了！‘));
                break;
            default:
                break;
        }
        
    }

    /**
     * @ interface 用户注册
     */
    public function reg() {
        $username = trim(isset($_REQUEST[‘username‘]) ? $_REQUEST[‘username‘] : ‘‘);
        $password = trim(isset($_REQUEST[‘password‘]) ? $_REQUEST[‘password‘] : ‘‘);
        $avatar = trim(isset($_REQUEST[‘avatar‘]) && in_array($_REQUEST[‘avatar‘], array(1,2,3,4,5,6,7,8,9)) ? intval($_REQUEST[‘avatar‘]) : 1);

        if ($this->_verifyUserName($username) !== 0 || strlen($password)<3 || strlen($password) > 20) {
            $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘注册失败！‘));
        }
        $password = md5($password);
        if (false === $this->db->query("INSERT INTO `users` (`username`, `password`, `avatar`) VALUES (‘{$username}‘, ‘{$password}‘, {$avatar})")) {
            $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘注册失败！‘));
        } else {
            $this->sendByAjax(array(‘message‘=>‘注册成功！‘));
        }
    }


    /**
     * @ 用户登陆
     */
    public function login() {
        $username = trim(isset($_REQUEST[‘username‘]) ? $_REQUEST[‘username‘] : ‘‘);
        $password = trim(isset($_REQUEST[‘password‘]) ? $_REQUEST[‘password‘] : ‘‘);

        if (isset($_COOKIE[‘uid‘])) {
            $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘你已经登陆过了！‘));
        }

        if ($rs = $this->db->get("SELECT * FROM `users` WHERE `username`=‘{$username}‘")) {
            if ($rs[‘password‘] != md5($password)) {
                $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘登陆失败！‘));
            } else {
                setcookie(‘uid‘, $rs[‘uid‘], time() + 3600*60, ‘/‘);
                setcookie(‘username‘, $rs[‘username‘], time() + 3600*60, ‘/‘);
                $this->sendByAjax(array(‘code‘=>0,‘message‘=>‘登陆成功！‘));
            }
        } else {
            $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘登陆失败！‘));
        }
    }

    /**
     * @ 用户退出
     */
    public function logout() {
        if (!isset($_COOKIE[‘uid‘])) {
            $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘你还没有登陆！‘));
        } else {
            setcookie(‘uid‘, 0, time() - 3600*60, ‘/‘);
            $this->sendByAjax(array(‘code‘=>0,‘message‘=>‘退出成功！‘));
        }
    }

    /**
     * 用户留言保存
     */
    public function send() {
        if (!isset($_COOKIE[‘uid‘])) {
            $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘你还没有登陆！‘));
        } else {
            $content = trim(isset($_POST[‘content‘]) ? $_POST[‘content‘] : ‘‘);
            if (empty($content)) {
                $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘留言内容不能为空！‘));
            }
            $dateline = time();
            $this->db->query("INSERT INTO `contents` (`uid`, `content`, `dateline`) VALUES ({$_COOKIE[‘uid‘]}, ‘{$content}‘, {$dateline})");
            $returnData = array(
                ‘cid‘        =>    $this->db->getInsertId(),
                ‘uid‘        =>    $_COOKIE[‘uid‘],
                ‘username‘    =>    $_COOKIE[‘username‘],
                ‘content‘    =>    $content,
                ‘dateline‘    =>    $dateline,
                ‘support‘    =>    0,
                ‘oppose‘    =>    0,
            );
            $this->sendByAjax(array(‘code‘=>0,‘message‘=>‘留言成功！‘,‘data‘=>$returnData));
        }
    }

    /**
     * @ 顶
     */
    public function doSupport() {
        if (!isset($_COOKIE[‘uid‘])) {
            $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘你还没有登陆！‘));
        } else {
            $cid = isset($_REQUEST[‘cid‘]) ? intval($_REQUEST[‘cid‘]) : 0;
            if (!$cid) $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘无效留言cid！‘));
            $content = $this->db->get("SELECT cid FROM `contents` WHERE `cid`={$cid}");
            if (!$content) $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘不存在的留言cid！‘));
            $this->db->query("UPDATE `contents` SET `support`=support+1 WHERE `cid`={$cid}");
            $this->sendByAjax(array(‘code‘=>0,‘message‘=>‘顶成功！‘));
        }
    }

    /**
     * @ 踩
     */
    public function doOppose() {
        if (!isset($_COOKIE[‘uid‘])) {
            $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘你还没有登陆！‘));
        } else {
            $cid = isset($_REQUEST[‘cid‘]) ? intval($_REQUEST[‘cid‘]) : 0;
            if (!$cid) $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘无效留言cid！‘));
            $content = $this->db->get("SELECT cid FROM `contents` WHERE `cid`={$cid}");
            if (!$content) $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘不存在的留言cid！‘));
            $this->db->query("UPDATE `contents` SET `oppose`=oppose+1 WHERE `cid`={$cid}");
            $this->sendByAjax(array(‘code‘=>0,‘message‘=>‘踩成功！‘));
        }
    }

    /**
     * @ 获取留言列表
     */
    public function getList() {
        $page = isset($_REQUEST[‘page‘]) ? intval($_REQUEST[‘page‘]) : 1;    //当前页数
        $n = isset($_REQUEST[‘n‘]) ? intval($_REQUEST[‘n‘]) : 10;    //每页显示条数
        //获取总记录数
        $result_count = $this->db->get("SELECT count(‘cid‘) as count FROM `contents`");
        $count = $result_count[‘count‘] ? (int) $result_count[‘count‘] : 0;
        if (!$count) {
            $this->sendByAjax(array(‘code‘=>1,‘message‘=>‘还没有任何留言！‘));
        }
        $pages = ceil($count / $n);
        if ($page > $pages) {
            $this->sendByAjax(array(‘code‘=>2,‘message‘=>‘没有数据了！‘));
        }
        $start = ( $page - 1 ) * $n;
        $result = $this->db->select("SELECT c.cid,c.uid,u.username,c.content,c.dateline,c.support,c.oppose FROM `contents` as c, `users` as u WHERE u.uid=c.uid ORDER BY c.cid DESC LIMIT {$start},{$n}");
        $data = array(
            ‘count‘    =>    $count,
            ‘pages‘    =>    $pages,
            ‘page‘    =>    $page,
            ‘n‘        =>    $n,
            ‘list‘    =>    $result
        );
        $this->sendByAjax(array(‘code‘=>0,‘message‘=>‘‘,‘data‘=>$data));
    }

    /**
     * @ 用户名验证
     */
    private function _verifyUserName($username=‘‘) {
        if (strlen($username) < 3 || strlen($username) > 16) {
            return 1;
        }
        $rs = $this->db->get("SELECT `username` FROM `users` WHERE `username`=‘{$username}‘");
        if ($rs) return 2;
        return 0;
    }
}

 

ajax 留言板

标签：

原文地址：http://www.cnblogs.com/mayufo/p/4297827.html
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
登录后才能评论！
分享档案
更多>
2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
mamicode.com排行更多图片
更多
友情链接
兰亭集智   国之画   百度统计   站长统计   阿里云   chrome插件   新版天听网
关于我们 - 联系我们 - 留言反馈
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码！